这个html中的button怎么在js中引用?

neo007

1. <input type="button" value="Calculate" onclick="calculate();">

复制代码

由于wordpress可视化的原因, 上述代码最后的onclick="calculate();" 经常会被去掉
我已经有一段js代码,(主要就是上述calculate函数) 已经实现自动插入到页面的footer中, 那么能否把onclick="calculate()"放到js中一起插入呢? 怎么引用这个button呢, 既没有id也没有class

badanwfs

不太懂  由于wordpress可视化的原因  是什么原因；能写js的话，使用js来设置：
addEventListener('click', calculate, false) 呗

os52

document.querySelector('input[type="button"][value="Calculate"]')

翼风Fly

2、3楼方法拼一下就差不多了。
1.3楼提到了一个选择的方法，不过若能添加ID尽量添加ID

1. <input type="button" value="Calculate" id="thisButtonName">

复制代码

若不能改ID，那么参照3楼，按照下面的方法改。
2.接下来对这个按钮做事件绑定，此处不考虑IE8及以下版本：

1. document.getElementById("thisButtonName").addEventListener("click", function(){
   
2.     calculate();
   
3. });

复制代码

2楼给出了一个简写方法，也没问题。

neo007

badanwfs 发表于 2019-2-18 21:09
不太懂  由于wordpress可视化的原因  是什么原因；能写js的话，使用js来设置：
addEventListener('c ...

我说可视化, 其实意思是: 编辑某个文本框里面的文本时, 它内置的编辑器有两个标签, 一个是visual, 一个是text. 我把带格式的内容(含表格)粘贴到visual, 然后切换到text, 没问题,看到html代码了. 如果我在代码里面添加onclick, 保存, 没问题. 但如果下一次我再访问这个文本区的visual(默认是先访问visual的), 并切换到text模式, onclick没了

neo007

翼风Fly 发表于 2019-2-18 21:51
2、3楼方法拼一下就差不多了。
1.3楼提到了一个选择的方法，不过若能添加ID尽量添加ID
若不能改ID，那么 ...

感谢朋友们, 这个方法很好用. 我按你们说的, 再拼凑了一下, 插入到js最后面:

1. // insert onclick or click
   
2. calc_element = document.querySelector('input[type="button"][value="Calculate"]');
   
3. if(calc_element.addEventListener){        
   
4.         calc_element.addEventListener('click', calculate, false);      
   
5. }
   
6. else if(calc_element.attachEvent){        
   
7.         calc_element.attachEvent('onclick', calculate);      
   
8. }

复制代码

猫饼

加个name不就完了,然后根据name获取