2011-03-30 2 views
0

이미지 맵을 만들고 양식이 있습니다. 양식에서 나는 세 개의 텍스트 필드가 있습니다. 이미지 맵을 클릭하면 번호 4를 클릭합니다. 숫자 4는 텍스트 필드 "regio"에 와야합니다.자바 스크립트 및 이미지지도? 어떻게 작동합니까?

다른 예. 숫자 9의 이미지 맵을 클릭하면 숫자 9가 텍스트 필드 "regio"에 와야합니다. http://www.testdomeinnaam.nl/mike/

그러나 내가이 어떻게 할 수 ???? : 여기

내 코드입니다 감사합니다 !!!

답변

9

세 가지 :

1 - 발사 이벤트를 첨부해야하는 모든 영역에 대해. 방법 하나

<area ... href="JavaScript: regionMap(6); void(0);" > 

방법이 :

<area ... onclick="regionMap(6); return false;"> 

방법 세 :이 방법은 alt 속성에서이 지역의 수를 소요

<script> 
    jQuery("#imagemap area").click(function(){ 
     var s = jQuery(this).attr("alt"); 
     regionMap(s.substr(s.length - 2)); 
    }); 
</script> 

주 -이 최선이 아니다 방법.

첫 번째 두 가지 방법 - 사용자가 이미 이벤트를 처리하고 있음을 브라우저에 알리기 위해 void(0) 또는 return false을 사용해야하며 사용자 클릭으로 인해 페이지를 보내지 않을 것이라고 기대하지 마십시오.

2 - regionMap가 methoid 구현

방법 하나 - 순수 JS

function regionMap(region) { 
     document.getElementById("regio").value = region; 
    } 

방법이 - jQuery를

를 사용
function regionMap(region) { 
     jQuery("#regio").val(region); 
    } 

3 - 페이지에 구현을 추가

방법 1 : HTML 페이지 코드에 포함

<script> 
    function regionMap(region) { 
     document.getElementById("regio").value = region; 
    } 
</script> 

웨이 2 - 사용 JS 리소스.

function regionMap(region) { 
     document.getElementById("regio").value = region; 
    } 

그리고 당신의 HTML에 대한 참조에 포함 : regionsform.js, 그 안에 - 예를 들어 파일을 만듭니다. 는 HTML을 가정하고 regions.js은 같은 폴더에 - 그것은

<script src="regionsform.js"></script> 

과 같을 것이다 적이 재미 & 행운을 빕니다 :)