Javascript 无法调试jQuery按钮

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

我看不出有什么问题。我尝试了firbug，但显然它甚至没有检测到javascript？：）谢谢

jquery：

$('.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:

12
支持者


支持

//投票否决按钮

12
向下


向下

您的HTML无效，因此我将执行以下操作：

<form action="javascript:alert('form')";>
<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>
</form>

和成功：

$(this).closest("li").siblings("li.score").find("h2.score_up")
       .html(msg).fadeIn();

我认为您在方面也会遇到问题，因为您希望防止

表单上出现默认值，在这种情况下，您可能会在委托方面遇到问题

下面是我将如何使用
.live（）
：

​

作为
的直接子级的HTML无效

的孩子应该是
。我不希望使用无效的HTML可以正常工作

在
中包含
的HTML：

<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>



12
支持者


支持



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();
           }
      });
 });

$（'.stats'）.delegate（'.support'，'click'，函数（e）{
//停止事件
e、 预防默认值（）；
//缓存对上一个
元素的引用
//因为它被多次使用
var$prevLi=$（this.nexist（'li'）.prev（'li'）；
//拿到身份证
var the_id=$prevLi.attr（'id'）.split（'uu'）.pop（）；
//主要的ajax请求
$.ajax({
背景:这,，
类型：“POST”，
数据：“行动=支持和id=“+行动id，
url：“ajax/sa.php”，
成功：功能（msg）{
$prevLi.find（“h2.score_up”）.html（msg.fadeIn（）；
}
});
});
请更具体地说明问题本身，如果不是，可能很难帮助您，请帮助我们帮助您！问题是，当我尝试单击html上的“支持”按钮时，它意味着发送一个ajax调用，然后在html上更新h2.score\u，在本例中为13，但它什么也不做，甚至没有发布！：）@逃走吧，你的成功也不太对。仍在编辑过程中。好的，在更正的成功回调中也添加了。非常感谢，它解决了ajax位，pheeeeeew，再次感谢我的投票，但它没有更新分数，我从firebug获得了正确的响应，但它没有更新网页上的分数（H2.support位）：）@getaway-我认为你的
.preventDefault（）出现了一些奇怪的情况，因为你想在
submit
而不是
单击时阻止默认设置。我知道如何做到这一点的方法是使用
live（）
。我总结了一个关于JSFIDLE的工作示例。您可能可以在单击状态下使用委托，但我遇到了问题。它在js fiddle上有效，但在我的页面上无效。我尝试了您的替代方案，但仍然相同thing@getaway-我还为HTML添加了一些清理。因为您有无效的HTML，这可能也导致了问题。现在试试看。另外，如果你能让它在JSFIDLE上工作，但不能在你的页面上工作，这意味着你的页面在某种程度上是不同的。嘿，帕特里克，你认为我应该怎么做，这与我们做的另一个页面有点不同？当我们使用链接的时候，我试着用我博客的按钮来做这个@逃跑-这个代码有效吗？我将
放在它自己的
中。不确定你是否想要这样。我们可以将它放在第一个
，但需要做一点修改。parick它工作正常，但它不会改变分数，而是删除it@Peter-不客气。我个人认为
live（）
被过度使用/过度推荐。通常，动态事件被添加到可以具有委托的特定容器中。我个人不会使用
.live（）
，除非页面上的任何位置都可以放置某种元素。我不认为这种情况经常发生。@getaway-从按钮开始，遍历到它的
，然后转到具有另一个按钮的适当
，然后
.find（）
按钮。然后取下原来的按钮。类似于这样的内容：
$（this）.closest（'li'）.next（）.next（）.find（'button'）.remove（）$（此选项）。删除（）
// Prevent form from submitting
$("form").live("submit", function(e) {
    e.preventDefault(); });

// Run Ajax
$('button.support').live('click', function(e) {
      //get the id
       var $score = $(this).closest("li").siblings('.score'),
           the_id = $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) {
               $score.find("h2.score_up").html(msg).fadeIn(); 
           }
      });
});

<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>

$('.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();
           }
      });
 });