點擊功能是不是在jQuery的

工作在我HTML我有ol和li這是我HTML 和我對這些鏈接腳本一樣，當我點擊它，我保持着警惕覈實它不工作點擊功能是不是在jQuery的

$('#namesId ol li').click(function() { 
 
    alert('clicked'); 
 
    //ToDo 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<div class="col-sm-4" id="namesId" style="padding:0px"> 
 
    <ol style="padding-left: 10px;"> 
 
    <li class="v"><a href="">Funny 10 second video! - YouTube (360p)</a></li> 
 
    </ol> 
 
</div>

點擊功能ID不工作什麼是它的問題。

來源

2017-09-13 bharath varma

哪裏是'namesId' ID？ –

「namesId」的定義在哪裏？ –

你可以包含關於'＃namesId'的相關HTML嗎？ – Vivick

正如你所說li是動態生成的，你必須使用jQuery event-delegation

所以做象下面這樣： -

$('#namesId ol').on('click',"li",function(e) { 
 
    e.preventDefault(); 
 
    console.log('clicked'); 
 
    //ToDo 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="col-sm-4" id="namesId" style="padding:0px"> 
 
    <ol style="padding-left: 10px;"> 
 
    <li class="v"><a href="">Funny 10 second video! - YouTube (360p)</a></li> 
 
    <li class="v"><a href="">Wildlife</a></li> 
 
    </ol> 
 
</div>

來源

2017-09-13 06:50:02

bharath varma很高興幫助你:) :)。感謝標記。 –

它應該是：

$('#namesId ol li:nth-child(1)').click(function() { 
     alert('clicked'); 
     //ToDo 
});   //for first li click 

$('#namesId ol li:nth-child(2)').click(function() { 
     alert('clicked'); 
     //ToDo 
});   //for second li click

來源

2017-09-13 06:50:37

沒有理由使用'：nth-child（1' –

你應該總是給你的答案留下一個解釋 –

下面的代碼工作正常。

<html> 
     <head> 
     <title>Test</title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
     </head> 
     <body> 
     <ol id="namesId" style="padding-left: 10px;"> 
       <li class="v"><a href="">Funny 10 second video! - YouTube (360p)</a> 
       </li> 
       <li class="v"><a href="">Wildlife</a></li> 
     </ol> 
     <script> 
     $('#namesId li').click(function() { 
       alert('clicked'); 
       //ToDo 
     }); 

     </script> 
     </body> 
    </html>

<html> 
 
<head> 
 
<title>Test</title> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
<ol id="namesId" style="padding-left: 10px;"> 
 
     <li class="v"><a href="">Funny 10 second video! - YouTube (360p)</a> 
 
     </li> 
 
     <li class="v"><a href="">Wildlife</a></li> 
 
</ol> 
 
<script> 
 
$('#namesId li').click(function() { 
 
     alert('clicked'); 
 
     //ToDo 
 
}); 
 

 
</script> 
 
</body> 
 
</html>

來源

2017-09-13 06:56:16

所以OP的代碼問題不是關於選擇器 – Rajesh

也請注意編輯器中的<<>'圖標。可以把你的* HTML/JS/CSS *代碼，並使其運行片段 – Rajesh

用戶上述代碼，因爲它只改變src（jquery文件位置）部分，它將工作正常。 –

試試這個：

$('#namesId ol').on('click', 'li', function(e){ 
    e.preventDefault(); 
    alert('clicked'); 
});

來源

2017-09-13 07:04:32

不需要從文檔 –

一路遍歷@AlivetoDie編輯後更好嗎？ –

是的。順便說一句，我已經投票給你，因爲至少概念是正確的 –

您已指明名稱的選擇#namesId，但它不是任何地方所定義。

這樣說吧，它會工作：

<div id="namesId"> 
    <ol style="padding-left: 10px;"> 
    <li class="v"><a href="">Funny 10 second video! - YouTube (360p)</a> 
    </li> 
    <li class="v"><a href="">Wildlife</a></li> 
</ol> 
</div>

來源

2017-09-13 07:25:32 Ylich

點擊功能是不是在jQuery的

回答

相關問題