Question

我有四个图像按钮，onclick事件附加到它们两对两个。我正在尝试用文本按钮替换这些图像按钮，并将onclick功能重新连接到下一个文本按钮。这些按钮并不总是在页面上，我只能使用jQuery 1.4，否则.prop会使这更容易。

考虑这个HTML：

<input type="image" src="path/to/image.gif" class="one" onclick="function()" />
<input type="image" src="path/to/image.gif" class="one" onclick="function()" />
<input type="image" src="path/to/image2.gif" class="two" onclick="function()" />
<input type="image" src="path/to/image2.gif" class="two" onclick="function()" />

我编写了以下jQuery代码来获取onclick函数，输入并重新绑定onclick函数。

$('input.one').each(function(){
  var oneOnClick = $(this).attr('onclick');
  $(this).replaceWith('<input type="button" value="one" class="one" onclick="'+oneOnClick+'" />');
)};

.two也一样。我发现在jQuery中返回onclick属性值的方式意味着无法完成。

在线使用一些资源我更新了我的代码：

var oneOnClick = $('input.one').first().attr('onclick');
var twoOnClick = $('input.two').first().attr('onclick');

$('input.one').each(function(){
  $(this).replaceWith('<input type="button" class="one" value="one"/>');
});
$('input.two').each(function(){
  $(this).replaceWith('<input type="button" class="two" value="two"/>');
});

$('input.one').live("click", oneOnClick);
$('input.two').live("click", twoOnClick);

但我收到了错误

TypeError：undefined不是对象（评估'b.split'）

当input.one不存在时。

我该如何做到这一点？

Answer 1

请尝试使用以下代码绑定onClick事件

$(document).ready(function(){
    $('input.one').each(function(){
       $(this).attr('type',"button");
    });
});

Answer 2

我建议你选择第一种选择方法：

选中 DEMO

function clickOne()
{
    alert('hi');
}
function clickTwo()
{
    alert('helleo');
}

$(document).ready(function(){
    var oneOnClick = $('input.one').first().get(0).attributes.onclick.nodeValue;
    var twoOnClick = $('input.two').first().get(0).attributes.onclick.nodeValue;
    $('input.one').each(function(){
        $(this).replaceWith('<input type="button" value="one" class="one" onclick="'+oneOnClick+'" />');
    });

    $('input.two').each(function(){
        $(this).replaceWith('<input type="button" value="two" class="two" onclick="'+twoOnClick+'" />');
    });
    $('input.one').live("click", oneOnClick);
    $('input.two').live("click", twoOnClick);
});

要点注意：


$('input.one').attr('onclick') 或 $('input.two').attr('onclick') 包含 onclick 属性的值（即串）。但是，因为浏览器以不同的方式处理事件属性，所以它们是   通过 function onclick() { clickOne() } 返回，您知道   对这个。因此，如果你想直接调用该函数，你就可以了   必须剥离    function() {} 或立即致电或使用它   的 get(0).attributes.onclick.nodeValue

在clickOne中包含 clickTwo 和 head ， document.ready

jQuery将onclick函数附加到元素

2 个答案: