Question

您好我正试图在我的锚标签上加一个onclick。我无法弄清楚为什么onclick不起作用。我正在使用jquery。这是我的HTML和Javascript代码。

<div class="well">
    <h4>Blog Categories</h4>
    <div class="row">
        <div class="col-lg-6">
            <ul class="list-unstyled">
                <li>
                    <a href="" >Videos</a>
                </li>
            </ul>
        </div>
    </div>
</div>

$(document).ready(function(){
    $(".list-unstyled a").click(function(event){
        event.preventDefault();

        alert("You clicked on me");
    });
});

javascript不会执行。警报永远不会显示。任何帮助将不胜感激。

Answer 1

您应该将选择器更改为以下内容，

 $(".list-unstyled li a")

因为此选择器$(".list-unstyled a")未选择您想要的内容。您尝试获取所有锚点，这些锚点是具有类list-unstyled的元素的子元素。您尝试选择的锚点不是ul的子级list-unstyled的子级，但它是li的子级，是ul的子级。

$(document).ready(function(){
    $(".list-unstyled li a").click(function(event){

        alert("You clicked on me");
      
        event.preventDefault();
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="well">
    <h4>Blog Categories</h4>
    <div class="row">
        <div class="col-lg-6">
            <ul class="list-unstyled">
                <li>
                    <a href="" >Videos</a>
                </li>
            </ul>
        </div>
    </div>
</div>

Answer 2

为什么不调用锚点标记的函数内联onclick事件？

<div class="well">
<h4>Blog Categories</h4>
<div class="row">
    <div class="col-lg-6">
        <ul class="list-unstyled">
            <li>
                <a onclick="clickingFunction()" href="" >Videos</a>
            </li>
        </ul>
    </div>
</div>

jquery / Javascript函数：

  function clickingFunction()
  {
     alert("You clicked on me"); 
  }

使用JQUERY锚点标记onclick

2 个答案: