用jQuery分解和修改元素

這是一個令人困惑的問題。我需要用<input>替換<input>，但我需要保留onclick屬性。這裏有一個例子：用jQuery分解和修改元素

<input type="image" class="previous_page_img graybutton mediumbutton" src="btn_prevpage.png" onclick="Add_Search_Param('page', 1); Refine();" alt="">

因爲我不能<input>類型更改爲一個按鈕，我想用一個按鈕來取代它，但是，我需要保留「的onclick」屬性。所以首先，我不得不分手這個元素。將其替換爲一個按鈕並將原始onclick屬性附加到新按鈕。

所以最後，我會把這個onclick="Add_Search_Param('page', 1); Refine();"添加到新的按鈕。由於onclick變化，簡單的.attr或.prop函數是不夠的。它必須克隆onclick屬性。誰能幫我？謝謝。

這裏的jsfiddle不能保持onclick屬性，但確實一切：http://jsfiddle.net/rAMcw/

來源

2012-02-03 henryaaron

你見過http://stackoverflow.com/questions/516265/jquery-unbind-event-handlers-to-bind-them-again-later？ – pete 2012-02-03 20:58:30

@pete如果我正在討論內聯JavaScript，這有什麼關係嗎？ – henryaaron 2012-02-03 21:00:40

試試這個插件：http://archive.plugins.jquery.com/project/copyEvents – skybondsor 2012-02-03 21:01:38

輸入之後只需創建一個新的按鈕，輸入設置爲display: none;（或jQuery('#input').hide()），並有按鈕的onclick觸發輸入的的onclick（jQuery('#button').click(function(){ jQuery('#input').trigger('click'); });

來源

2012-02-03 21:01:56

這是個好主意... – henryaaron 2012-02-03 21:03:56

所有jQuery UI插件的工作方式都是相同的，它們隱藏了您選擇的元素並將其替換爲一個漂亮的元素，然後將所有內容鏈接到後臺。 – 2012-02-03 21:06:42

真相，我正在尋找更自然的解決方案，但它是一個創造性的想法，所以我喜歡它。我做了一個小提琴，但我可能想要一個不同的解決方案。http://jsfiddle.net/rAMcw/1/ – henryaaron 2012-02-03 21:09:31

你可以這樣做（我用一個簡單的JavaScript函數來測試它）

<input type="image" class="previous_page_img graybutton mediumbutton" src="btn_prevpage.png" onclick="Add_Search_Param('page', 1); Refine();" alt=""> 

var onclick = $('.mediumbutton').attr('onclick'); 

var but = $('<input/>', { type: "button", value: "pressme", onclick: onclick}); 

$('.mediumbutton').replaceWith(but);

小提琴這裏http://jsfiddle.net/KjBm3/

來源

2012-02-03 21:04:42

我怎麼能得到這個工作jQuery 1.4.2？ – henryaaron 2012-02-03 21:14:15

@ user1090389它適用於jQuery 1.4.4 http://jsfiddle.net/KjBm3/1/我無法測試它與1.4.2，但它應該是相同的 – 2012-02-04 11:32:13

由於某種原因，它贏得了'在我的網站上工作，我試過了它與1.3.2，它不起作用... – henryaaron 2012-02-04 23:09:57

克隆怎麼樣？

var x = $('input').clone(true); 
x.attr('type','button').addClass('previous_page_img graybutton mediumbutton').val('Previous Page'); 
$('input').replaceWith(x);

更新jsFiddle

來源

2012-02-03 21:09:49 j08691

有什麼不對的轉動現有input元素成一個按鈕？

$("input.previous_page_img").prop("type", "button").val("Previous Page");

jQuery 1.4.2 :(在普通舊JavaScript中設置屬性）;

$("input.previous_page_img").val("Previous Page")[0].type = "button";

Demo

來源

2012-02-03 21:13:23 Dennis

原因，我只能使用'.attr'舊版本的jQuery。無法更新... – henryaaron 2012-02-03 21:15:25

更新它的舊版本。 – Dennis 2012-02-03 21:18:01

好吧，但如果元素，不存在於某個頁面上，其餘的jQuery失敗？ – henryaaron 2012-02-03 21:23:23

用jQuery分解和修改元素

回答

相關問題