使用 jQuery 拆分和修改元素

Question

这是一个令人困惑的问题。我需要将 替换为不同的 但我需要保留 onclick 属性。这是一个示例：

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

由于我无法将 类型更改为按钮，因此我想将其替换为按钮，但是，我需要保留“onclick”属性。所以首先，我必须分解这个元素。将其替换为按钮并将原始 onclick 属性附加到新按钮。

所以最后，我将这个 onclick="Add_Search_Param('page', 1); Refine();" 添加到新按钮中。由于 onclick 发生变化，简单的 .attr 或 .prop 函数是不够的。它必须克隆 onclick 属性。谁能帮助我吗？谢谢。

这是 jsFiddle，它不保留 onclick 属性，但执行其他所有操作： http://jsfiddle.net/rAMcw/

Answer 1

你可以（我使用一个简单的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/

Answer 2

只需在输入后立即创建一个新按钮，将输入设置为 display: none; （或 jQuery('#input').hide()）并让按钮onclick 触发输入的 onclick (jQuery('#button').click(function(){ jQuery('#input').trigger('click'); });

Answer 3

克隆怎么样？

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

更新了jsFiddle

Answer 4

将现有的 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";

演示