다른 요소에서 onClick 이벤트를 사용하여 div의 backgroundPosition을 변경하는 방법

어떻게이 항목을 조합하면됩니까? 이 웹 사이트에서 작업 할 때마다 메뉴의 항목을 클릭 할 때마다 두 개의 특정 DIV의 백그라운드 위치가 변경되어 선택 항목을 유지해야합니다.다른 요소에서 onClick 이벤트를 사용하여 div의 backgroundPosition을 변경하는 방법

먼저 내가 "P"는 URL을 저장하는 변수를 만들 당신이 우리에 대한에있는 경우, 예를 들어, 당신은 아마 이것에 같은 것을 볼 수 있도록/선택한 페이지 주소 : 여기

내 시도 주소 표시 줄 :

<a href="?p=aboutus" onclick="changeBG()">About Us</a>

website.com/index.php?p=aboutus 메뉴에

버튼에 우리에 대해 나는 기능 changeBG 온 클릭에 대한 호출로 이런 짓을

나는 트릭을하기 위해 자바 스크립트가 필요하다고 생각했다. 그리고 여기 내가 주식 인 곳이다.

이 헤더에가는 스크립트입니다 :

<script type="text/javascript"> 
    <? 
// Set "p" value to HOME if previously empty. 
if ($_GET['p']=='') $_GET['p']='home'; 
    ?> 
function changeBg(pvalue) { 
if (pvalue == '') {pvalue = '<?=$_GET['p'];?>'; 
    } 
    if (pvalue=='aboutus'){ 
    document.getElementById('this_is_the_first_to_be_changed').style.backgroundPosition=0 20px; 
      document.getElementById('this_is_the_other_to_be_changed').style.backgroundPosition=0 80px; 

      if (pvalue=='contactus'){ 
      document.getElementById('this_is_the_first_to_be_changed').style.backgroundPosition=0 10px; 
        document.getElementById('this_is_the_other_to_be_changed').style.backgroundPosition=0 100px; 
    } 

      } 
    </script>

이 몸에가는 것입니다 :이 작동하지 않는 이유

<div id="left_menu"> 
<a href="?p=aboutus" onclick="changeBG()">About Us</a> 
<a href="?p=contact" onclick="changeBG()">Contact Us</a> 
</div> 
<div id="this_is_the_first_to_be_changed"> 
</div> 
<div id="this_is_the_other_to_be_changed"> 
</div>

누구든지 발견 할 수 있습니까?

출처

2012-01-02 Vinicius Santana

왜 작동하지 않는 지 모르겠지만 비즈니스 논리와 디스플레이 논리를 혼동하지 말라고 강력히 권고합니다. PHP가 가능하기 만하면 좋은 생각은 아닙니다. 아주 빨리 당신은 완전히 읽을 수없는 코드로 끝을 맺습니다 (위의 예에서와 같이). 어떤 부분이 PHP이고 어떤 부분이 Javascript인지 알아 내려고 시도하는 것은 절대적으로 악몽입니다 (유사한 언어를 사용하고 있기 때문에). 가능한 한 별개로 유지해야합니다. –

나는 당신에게 동의하지만, 당신이 보는 것은 빙산의 일부일뿐입니다. 여기 전체 프로젝트에서 선택할 수 있습니다 : www.daterraweb.com/projects/brazilpax/site/v1/ 실제로 내가하려는 것은 왼쪽과 위쪽 메뉴로 각각 파란색 화살표를 움직이는 것입니다 위아래로, 그리고 옆으로, 그래서 그들은 전체 노란색 화살표와 일치합니다. 더 좋은 아이디어가 있다면 –

따옴표를 사용해보십시오 : style.backgroundPosition = "0 20px";

이 라인에 대해, 또한 무엇을

업데이트 : 유의 확률 = '';

당신이 설정하는 유의 확률 = '=의 aboutus'

는 스크립트 요소가 잘못

업데이트 :

<script type="java/text">

은 맞다 :

또한 사용 방화범

<script type="text/javascript">

또는 크롬 페이지에 생성 된 JS를 볼 수 있습니다.

출처

2012-01-02 20:32:28 EricSonaron

을 입력하십시오. 인용문은 속임수를 쓰지 않았지만, 그것을 사용하면 문자열로 값을 변환시키지 않을지 궁금합니다. –

예 ... 그 이상. p 값을 p 값으로 채우십시오.P는 메뉴에서 항목을 클릭 할 때 값이 변경되는 변수입니다. 나는 href = "? p = aboutus"를 사용하여 그렇게했다. 어쨌든. pvalue가 올바른 콘텐츠를 수신하고 있습니다. 문제는 조건부에 있습니다. 실제 프로젝트를보고 싶다면 www.daterraweb.com/projects/brazilpax/site/v1/ –

오 .. 당신이 말하는 것을 봅니다. 그렇습니다, 그것의 과다한, 그러나 결국 pvalue는 적당한 가치를 아직도 얻고 있습니다. –

다른 요소에서 onClick 이벤트를 사용하여 div의 backgroundPosition을 변경하는 방법

답변

관련 문제