attr 新的 onclick 功能不起作用答案

【问题标题】：attr new onclick function not workingattr 新的 onclick 功能不起作用
【发布时间】：2020-10-26 20:39:29
【问题描述】：

我正在替换一个 onclick attr ......

$('#divName').attr('onclick','newFunction()');

function newFunction(){
    alert('New Function Success');
}

我当前的html是

<div id="divName" onclick="oldFunction()">

在我插入新的 attr 之后，检查元素会显示这个

<div id="divName" onclick="newFunction()">

但是当我点击时，没有显示警报消息，所以新功能没有应用于点击事件，有什么想法吗？

【问题讨论】：

.click(newFunction)，可能在.off('click') 之后。属性用于传达文档的初始状态，不一定要跟踪对它的进一步修订。
How to add onclick to a html element dynamically using javascript的可能重复

标签： jquery

【解决方案1】：

您应该使用不显眼的事件处理程序并使用.on() 附加事件处理程序

var $elem = $('#divName');

//Remove previous event handler
$elem.prop('onclick',null);

//Bind new event handler
$elem.on('click', newFunction);

function oldFunction() {
  console.log('old funnction.');

  var $elem = $('#divName');

  //Remove previous event handler
  $elem.prop('onclick', null);

  //Bind new event handler
  $elem.on('click', newFunction);

  console.log('New Event handler attached, click again');
}

function newFunction() {
  console.log('New Function Success');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="divName" onclick="oldFunction()">click me</div>

【讨论】：

@MShack，看代码sn-p，你什么时候想执行脚本？

【解决方案2】：

我不知道这些代码的目的是什么。但我试图给你另一个解决方案。希望能解决您的问题。

html:

 <div id="divName" onclick="oldFunction()">

关于脚本：

 $('#divName').addClass('newClass');

 $('.newClass').click(
   function(){
    alert('New Function Success');
   }
 );

如果你需要改变另一个函数，你可以改变你的属性。

【讨论】：

【解决方案3】：

由于 jQuery 提供了 .click() 函数，您可以使用它来代替。请尝试以下解决方案。删除 onlick 并将 click() 附加到 div

$("#divName").attr("onclick","").click(newFunction);

function newFunction(){
    alert('New Function Success');
}

【讨论】：

【解决方案4】：

我也面临同样的问题。在控制台上检查。它显示onclick="newFunc()"，但是当检查按钮时，它在单击oldFunc() 调用后显示oldFunc()。只需用纯 JavaScript 替换我的代码，即使用 document.getElementbyId 并使用 setAttribute() 更新 onclick。

var btn=document.getElementById('myBtn');
btn.setAttribute('onclick',"test()");

【讨论】：