jquery - attr 新的 onclick 功能不起作用

Question

我正在替换 onclick 属性......

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

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

我当前的html是

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

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

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

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

Answer 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>