developer tip

이 jQuery 클릭 기능이 작동하지 않는 이유는 무엇입니까?

optionbox 2020. 7. 28. 08:27
반응형

이 jQuery 클릭 기능이 작동하지 않는 이유는 무엇입니까?


암호:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $("#clicker").click(function () {
        alert("Hello!");
        $(".hide_div").hide();
    });
</script>

위의 코드는 작동하지 않습니다. #clicker를 클릭하면 경고하지 않고 숨겨지지 않습니다. 콘솔을 확인했는데 오류가 없습니다. 또한 JQuery 가로 드되고 있는지 실제로 확인했습니다. 문제가 무엇인지 확실하지 않습니다. 나는 또한 경고와 함께 문서 준비 기능을 수행했으며 내가 잘못한 것을 확신하지 못했습니다. 도와주세요. 감사!


$(document).ready(function() {});블록에 자바 스크립트 코드를 추가해야합니다 .

$(document).ready(function() {
  $("#clicker").click(function () {
    alert("Hello!");
    $(".hide_div").hide();
  });
});

jQuery 문서에서 알 수 있듯이 "문서를"준비 "할 때까지 페이지를 안전하게 조작 할 수 없습니다. jQuery는 이러한 준비 상태를 감지합니다. 내부에 포함 된 코드 $( document ).ready()는 페이지 DOM (문서 개체 모델)이 JavaScript에 대해 준비된 후에 만 ​​실행됩니다 . 실행할 코드 "


$ (document)와 함께 ON을 사용 하여이 문제에 대한 최상의 해결책을 찾았습니다.

 $(document).on('click', '#yourid', function() { alert("hello"); });

id로 시작하려면 아래를 참조하십시오.

$(document).on('click', 'div[id^="start"]', function() {
alert ('hello'); });

마지막으로 1 주 후에 onclick triger를 추가 할 필요가 없습니다. 나는 이것이 많은 사람들을 도울 수 있기를 바랍니다


코드가 document.ready ()없이 작동 할 수 있습니다. 스크립트가 #clicker 다음에 있는지 확인하십시오. 이 데모를 확인하십시오 : http://jsbin.com/aPAsaZo/1/

준비된 개념의 아이디어. 스크립트가 페이지의 최신 항목이거나 영향을받는 요소 다음에 오는 경우 작동합니다.

<!DOCTYPE html>
<html>
<head>


<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <script src="https://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>
  <a href="#" id="clicker" value="Click Me!" >Click Me</a>
  <script type="text/javascript">

        $("#clicker").click(function () {
            alert("Hello!");
            $(".hide_div").hide();

        });


</script>

</body>
</html>

주의 : 에서 교체 데모 httphttps코드에가, 또는이 변형 사용 데모


$(document).ready(function(){});Look this JSfiddle으로 Javascript 코드를 래핑해야합니다 .

JS 코드 :

$(document).ready(function() {

    $("#clicker").click(function () {
        alert("Hello!");
        $(".hide_div").hide();    
    });
});

Try adding $(document).ready(function(){ to the beginning of your script, and then });. Also, does the div have the id in it properly, i.e., as an id, not a class, etc.?


Be sure there is nothing on your button (such a div or a trasparent img) that keeps from clicking the button. It sounds stupid, but sometimes we think that jQuery is not working and all that stuffs and the problem is on the positioning of DOM elements.


You can use $(function(){ // code }); which is executed when the document is ready to execute the code inside that block.

$(function(){
    $('#clicker').click(function(){
        alert('hey');
        $('.hide_div').hide();
    });
});

Just a quick check, if you are using client-side templating engine such as handlebars, your js will load after document.ready, hence there will be no element to bind the event to, therefore either use onclick handler or use it on the body and check for current target

참고 URL : https://stackoverflow.com/questions/18602331/why-is-this-jquery-click-function-not-working

반응형