javascript - 无法调试 jQuery 按钮

Question

我有这个按钮，当点击它时，它会发送一个 ajax 调用来改变 score_up 的值。

我不明白问题是什么。我试过 firbug，但显然它甚至没有检测到 javascript？ :))谢谢。

j查询:

$('.stats').delegate('.support', 'click', function(e) {

      //stop event
      e.preventDefault();
      //get the id
       var the_id = $(this).closest('.score').attr('id').split('_').pop();
        //the main ajax request
       $.ajax({
           context:this,
           type: "POST",
           data: "action=support&id=" + the_id,
           url: "ajax/sa.php",
          success: function (msg) {

               $(this).siblings("h2.score_up").html(msg).fadeIn();
                //remove down button
                // and remove support button


           }
      });
   });

html:

 <ul class="stats">
        <li id="support_23"class="score">
            <h2 class="score_up">12</h2>
            <span style="text-align:center;">Supporters</span>
        </li>
        <li>
    <button type="submit" value="Actions" class="support" title="support">
        <i></i>
        <span>Support</span>
    </button>
</li>


//vote down button

 <li id="down_23"class="score">
            <h2 class="score_down">12</h2>
            <span style="text-align:center;">down</span>
        </li>
        <li>
    <button type="submit" value="Actions" class="down" title="down">
        <i></i>
        <span>down</span>
    </button>
</li>

    </ul>

Answer 1

它不是 <button> 的有效 HTML成为 <ul> 的直系子代.

<ul> 的 child 应该是 <li> .我不希望使用无效的 HTML 可以正常工作。

带有 <button> 的 HTML在 <li> 里面:

<ul class="stats">
    <li id="topic_23" class="score">
        <h2 class="score_up">12</h2>
        <span style="text-align:center;">Supporters</span>
    </li>
    <li>
        <button type="submit" value="Actions" class="support" title="support">
            <i></i>
            <span>Support</span>
        </button>
    </li>
</ul>

jQuery，修复了一些遍历方法:

$('.stats').delegate('.support', 'click', function(e) {
      //stop event
      e.preventDefault();
        // cache a reference to the previous <li> element
        //   since it is used more than once
       var $prevLi = $(this).closest('li').prev('li');
      //get the id
       var the_id = $prevLi.attr('id').split('_').pop();
        //the main ajax request
       $.ajax({
           context:this,
           type: "POST",
           data: "action=support&id=" + the_id,
           url: "ajax/sa.php",
          success: function (msg) {
               $prevLi.find("h2.score_up").html(msg).fadeIn();
           }
      });
 });