HTML（），然後單擊處理

我最初得到這個代碼並且一切運作良好：HTML（），然後單擊處理

<div class="rm"> 
     <button id="sub" type="submit"> 
      <span>Registo</span> 
     </button> 
    </div> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
     $(".rm>#sub").click(function(event) { 
      event.preventDefault(); 
      var formdata = $("#custom").serialize(); 
      $.ajax({ 
       url: "dojo/insert.php", 
       type: "post", 
       dataType: "json", 
       data: formdata, 
       success: function(data) { 
        switch (data.livre) { 

        case 'error': 
         $(".rm").html('<button id="sub" type="submit"><span>Rever</span></button>'); 
         break;      

        default: 
         $('#paginas').delay(50).load('profile_empresa_3.php');   
         break; 
        } 
       } 
      }); 
      return false;    
     }); 
    }); 
    </script>

現在的問題。當我添加$(".rm").html("")與具有相同ID的按鈕。如果我點擊這個新按鈕，頁面被重新加載。我的問題是。如果添加的按鈕具有相同的ID，爲什麼點擊處理程序不重複？

感謝

來源

2012-02-01 Daniel

'ID'-S應該是唯一的。更好地使用相同的'''你的按鈕 – 2012-02-01 17:39:34

@Zoltan：在粘貼的代碼中，新按鈕替換舊的按鈕。 jQuery 1.7中的 – 2012-02-01 17:43:20

在您綁定的事件處理程序$(".rm > #sub")的時候，新的元素還不存在，因此jQuery的不能處理程序綁定到它。

你既可以重新綁定事件處理程序，或將其綁定到$('.rm')來代替，而事件委託（使用.on()）：

$('.rm').on('click', '#sub', function() { // or use button instead of #sub 
    //... 
});

，而不是替換整個元素，但，似乎你可以只改變其文本內容：

$('#sub span').text('Rever'); 
// or 
$('.rm button span').text('Rever');

還要注意，ID被認爲是獨特的，具有在DOM中的兩個元件具有相同的ID是無效。

來源

2012-02-01 17:40:56

使用jQuery的的.click().on()代替 - http://api.jquery.com/on/

來源

2012-02-01 17:38:13 techfoobar

ID需在頁面上獨一無二的。

要添加同樣的動作爲所有新動態創建的按鈕，你需要做的是這樣的：

$(".rm > .sub").live("click",function(event) { 
....

但是，如果沒有使用相同的ID，使用類，而不是因爲我有以上。

來源

2012-02-01 17:39:55

，live方法顯然已被棄用。 – Daniel 2012-02-01 17:59:14

啊，是的，我忘了！ .delegate然後！ – 2012-02-02 09:02:01

click函數將遍歷DOM，並將該事件綁定到當時存在的所有元素。您稍後將創建一個新的DOM元素，該元素不會被綁定。

要按照您的方式完成此項工作，請參閱live()函數的jQuery文檔。

產生的變化將是這樣的：

$('#sub').live('click', function(event) { 
    //your implementation 
});

來源

2012-02-01 17:39:58 wsanville

發生這種情況是因爲事件綁定在唯一的DOM對象中，無論id是什麼，當您刪除初始按鈕並用具有相同id的一個替代綁定到該按鈕的事件消失時。

你可以做的是在變量中聲明事件函數，當你重新制作按鈕時，再次爲它分配事件。

您的代碼將是：

var btnEvent = function(e) { 
    e.preventDefault(); 
    var formdata = $("#custom").serialize(); 
    $.ajax({ 
     url: "dojo/insert.php", 
     type: "post", 
     dataType: "json", 
     data: formdata, 
     success: function(data) { 
      switch (data.livre) { 

      case 'error': { 
       $(".rm").html('<button id="sub" type="submit" onclick="return btnEvent(event)"><span>Rever</span></button>'); 

      } break;      

      default: 
       $('#paginas').delay(50).load('profile_empresa_3.php');   
       break; 
      } 
     } 
    }); 
return false;    
}; 
$(document).ready(function() { 
    $(".rm>#sub").click(btnEvent); 
});

來源

2012-02-01 17:48:12 MoSs

HTML（），然後單擊處理

回答

相關問題