2014-11-22 2 views
0

JavaScript 및 jQuery를 사용하기 시작하면서 고유 div가있는 질문이 있습니다.고유 한 버튼 누르기 동작 수행

JavaScript에서 고유 한 div 이름을 만들 수 있습니까? onclick?

http://jsfiddle.net/agmr2ytd/4/

예 HTML :

<div id="favoriteXBSbQG6fNlObroDG4ML2l9VRO/yNpvIFxL0Qjr6bP2A="> 
    <a href="#" id="XBSbQG6fNlObroDG4ML2l9VRO/yNpvIFxL0Qjr6bP2A=" class="btn btn-danger">Me</a> 
</div> 
<div id="favoriteakkbN3eo8h0Q7S4ouHqMX7cU9vNLNKw3llO/PK0e9qI="> 
    <a href="#" id="akkbN3eo8h0Q7S4ouHqMX7cU9vNLNKw3llO/PK0e9qI=" class="btn btn-danger">Me 2</a> 
</div> 

자바 스크립트 :

$(function() { 
    $('.favorite').click(function() { 
     var element = $(this); 
     var verify = element.attr("id"); 
     alert(verify); 
     $('#favorite'+verify).hide(); 
    }); 

}); 

내가 사업부에서 처음 a을 눌러

은 내가 alert로 id 값을 얻고 그것을 숨길 싶어요.

+1

''즐겨 찾기 ''클래스의 요소가 있습니다. –

+0

또한 이스케이프해야 할 'id'에 특수 문자가있는 문제가 있습니다 ... jQuery API – charlietfl

+0

@DavidThomas의 셀렉터 섹션을 참조하십시오. 미안하지만, 이해가 가지 않습니다. 무슨 소리 야? – WinterTime

답변

1

귀하 선택자가 잘못되었습니다. 속성의 경우 ^=은 "속성 값 "로 시작 :

$(function() { 
    $('[id^=favorite] a').click(function() { 
     var element = $(this); 
     var verify = element.attr("id"); 
     alert(verify); 
     $('#favorite'+verify.replace(/([ #;?%&,.+*~\':"!^$[\]()=>|\/@])/g,'\\$1')).hide(); 
    }); 
}); 

Example Fiddle < -

귀하의 ID 솔루션을위한 used this answer 탈출해야합니다.

+0

대단위! 정말 고맙습니다! :) – WinterTime

2

당신은 다음이가 작동, 당신의 div의에 좋아하는 클래스를 = 설정해야합니다

DEMO

jQuery를/자바 스크립트 :

$(function() { 
    $('.favorite').click(function() { 
     var element = $(this); 
     var verify = element.attr("id"); 
     alert(verify); 
     var tohide = document.getElementById(verify); 
     tohide.style.display = 'none'; 
    }); 

}); 

HTML :

<div id="favoriteXBSbQG6fNlObroDG4ML2l9VRO/yNpvIFxL0Qjr6bP2A=" class="favorite"> 
    <a href="#" id="XBSbQG6fNlObroDG4ML2l9VRO/yNpvIFxL0Qjr6bP2A=" class="btn btn-danger">Me</a> 
</div> 
<div id="favoriteakkbN3eo8h0Q7S4ouHqMX7cU9vNLNKw3llO/PK0e9qI=" class="favorite"> 
    <a href="#" id="akkbN3eo8h0Q7S4ouHqMX7cU9vNLNKw3llO/PK0e9qI=" class="btn btn-danger">Me 2</a> 
</div>