首頁 > 開發者 > JavaScript
最近再寫一個項目，用到了innerHTML，但是呢，發現調用innerHTML之後，onclick失效了，這也是在意料之中的，因為innerHTML是以文本形式插入的button，所以無法識別onclick事件，所我們只有另找出路了，我們不能直接實現，但是可以間接實現，下面就舉個例子：
例子一：該例子是無法實現的onclick的
複製代碼 代碼如下:
<html>
<head>
<script defer>
function insCell(th)
var name=th.name;
var id=th.id;
if(name=="no"){
id.innerHTML="<input type='button' onclick='insCall(this)' value='上線'
name='no' id='1'>";
}else{
id.innerHTML="<input type='button' onclick='insCall(this)' value='下線'
name='yes' id='1'>";
}
</script>
</head>
<body>
<br />
<span id="msg">
<input type="button" onclick="insCall(this)" value="下線" name="yes" id="1">
</span>
</body>
</html>
上面的例子是，根據button的name判斷是上線，還是下線~~~我們發現，當點擊第一次之後，再點擊就無效了~~~~~~
這時候我們可以變相的實現，如下：
複製代碼 代碼如下:
<html>
<head>
<script defer>
function insCell(th)
{
var name=th.name;
var id=th.id;
alert(name+"--"+id);
var span=document.getElementById(id);
if(name=="no"){
span.innerHTML="<input type='button' value='下線'>";
span.name="yes";
}else{
span.innerHTML="<input type='button' value='上線'>";
span.name="no";
}
}
</script>
</head>
<body>
<br />
<span id="1" onclick="insCell(this)" name="no">
<input type="button" value="上線">
</span>
</body>
</html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
