javascript - Javascript 单击网页中的特定按钮
问题描述
这是我的工作示例页面https://graphicstogether.com/free-trial/
我正在使用 Wordpress 联系表 7。问题是当我单击附件上的清除按钮时,它点击了发送按钮。如何单独控制每个按钮操作?
**
我也面临 JS 代码的错误。我在页脚应用了这个 JS 代码。
**
html
<input type="file" name="file-860" size="40" class="wpcf7-form-control wpcf7-file" id="file1" accept=".jpg,.jpeg,.png,.gif,.pdf" aria-invalid="false">
<input type="file" name="file-860" size="40" class="wpcf7-form-control wpcf7-file" id="file2" accept=".jpg,.jpeg,.png,.gif,.pdf" aria-invalid="false">
JS
var f = document.querySelectorAll('input[type=file]'),
clearInput = function(){this.previousSibling.value = '';};
for(var i = 0; i < f.length; i++){
button = document.createElement('button');
button.textContent = 'clear';
button.addEventListener('click', clearInput);
f[i].parentNode.insertBefore(button, f[i].nextSibling);
}
解决方案
对于不发送表单,按钮必须为 type="button",否则为 type="submit"。
<button type="button">clear</button>
推荐阅读
- javascript - 将当前位置更新为实时数据库未更新
- html - 等高引导卡(雨果)
- android - 是否可以在Android中获取系统设置的主题?
- postgresql - 将一组选定的子表加入一个父表
- python - python将timedelta转换为有意义的字符串,例如“1小时”
- api - 我们如何使用 tensorflow API 在每 100 个步骤中保存检查点和评估日志
- php - Symfony 警告:PHP 没有使用配置文件 (php.ini)
- c# - 如何在 Umbraco 视图中填充 DropdownList
- python - 使用python输入一个csv文件
- c++ - C++17 编译器(gcc 或 Microsoft Visual C++),是否有一个选项禁止“不产生临时”功能