Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/460.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/37.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 无法单击按钮元素中的输入元素_Javascript_Css_Html_Javascript Events - Fatal编程技术网

Javascript 无法单击按钮元素中的输入元素

Javascript 无法单击按钮元素中的输入元素,javascript,css,html,javascript-events,Javascript,Css,Html,Javascript Events,查看以下标记和小提琴: 测试元件 添加文件 在Chrome中,可以通过开发者控制台选择按钮中的每个元素,并委派js单击事件 在Firefox/IE中,不能选择子元素或单击事件 在Firefox/IE中有没有办法解决这个问题?不建议在按钮中使用元素,因此您可以使用“div”而不是“button”,这将使它在mozilla和chrome中都能工作。检查下面 <div id="button" type="button"> <span id="test" style="b

查看以下标记和小提琴:


测试元件
添加文件
在Chrome中,可以通过开发者控制台选择按钮中的每个元素,并委派js单击事件

在Firefox/IE中,不能选择子元素或单击事件


在Firefox/IE中有没有办法解决这个问题?

不建议在按钮中使用元素,因此您可以使用“div”而不是“button”,这将使它在mozilla和chrome中都能工作。检查下面

<div id="button" type="button">
    <span id="test" style="background:pink;">test element</span>
    Add File
    <input type="file" name="file" multiple="multiple" id="upload">
</div>

测试元件
添加文件

这不是一种好的样式。我甚至可以说这种方式不正确。你可以在按钮上设置“单击”事件来单击输入。因此,如果你想隐藏输入[文件]元素,但让它可单击,你可以像我说的那样做。这里是一个非常好的事件文档和示例链接


这不是有效的HTML标记。按钮不能包含交互内容,如输入元素(隐藏类型除外)。你最好解释一下为什么你需要在一个按钮中包装一个输入类型的文件,这并没有真正的意义这在inFirfox和Chrome中也可以使用;请参阅此代码打开所需按钮元素(用于init)的旧版本,然后插入输入元素@a。Wolff@minlare听起来很奇怪!有具体的例子吗?为什么不升级插件版本?授权阻止升级,我会选择使用div(记得不使用按钮时出现问题,但记不起是什么…希望我会没事,否则很快会再次出现!)谢谢@a.WolffThanks,这是我的下一步,只是希望有一种方法可以实现这一点css@minlare如果上述解决方案有帮助,请将其标记为回答/投票
<div id="button" type="button">
    <span id="test" style="background:pink;">test element</span>
    Add File
    <input type="file" name="file" multiple="multiple" id="upload">
</div>