2012-04-23 53 views
1

我設法讓單選按鈕的更改事件觸發。然而,我現在需要它爲HTML工作,其中單選按鈕被添加到replaceWith標記。如何使用replaceWith添加html的單選按鈕的更改事件工作

所以它被添加到我的標記有:

$(this).replaceWith('<input type="radio" name="variety" value="null" id="myradio" />'); 

所以,我有醒目變化事件的代碼是:

$('#myradio').change(function() { 
     alert("Hello"); 
    }); 

因此,沒有人知道我怎麼會做這個工作因爲單選按鈕現在是在初始頁面加載後添加到頁面的?

回答

2

你可以使用.on()(jQuery的1.7+)或.delegate()(jQuery的1.4.3+)訂閱改變事件,以考慮動態地添加元素。

例如:

$('#myradio').live('change', handler);    // jQuery 1.3+ 

$(document).delegate('#myradio', 'change', handler); // jQuery 1.4.3+ 

$(document).on('change', '#myradio', handler);  // jQuery 1.7+ 

同樣重要的是要指出,這是沒有必要這個訂閱放置document.ready回調中。

0

您可以使用下列內容:

 
$('body').on('change', '#myradio', function() { 
    alert("Hello"); 
}); 

如果你事先知道在哪個你會把單選按鈕的元素,你應該改變「身體」選擇爲表現該元素相匹配。

0

或者:

  • 使用jQuery on到父

    <div id="container"> 
        <!--replaceable elements--> 
    </div> 
    
    //this will take effect on current and future children 
    $('#container').on('change','targetSelector',function(){ 
        alert("Hello"); 
    }); 
    
  • 或直接綁定到新元件

    function func(){ 
        alert("Hello"); 
    } 
    
    var newEl = $('<input type="radio" name="variety" value="null" id="myradiobutton" />'); 
    newEl.change(func); 
    $(this).replaceWith(newEl); 
    

我喜歡的第一個雖然,爲perfo浪漫和乾淨的代碼。

0

您可以創建單選按鈕,添加更改事件,然後用單選按鈕替換this

var $radio = $('<input type="radio" name="variety" value="null" id="myradio" />'); 
$radio.change(function() { 
    alert("Hello"); 
}); 
$(this).replaceWith($radio); 
相關問題