Question

看一下下面的标记＆amp;小提琴： http://jsfiddle.net/minlare/oh1mg7j6/

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

在Chrome中，可以通过开发者控制台选择按钮中的每个元素，并委派js点击事件。

在Firefox / IE中，您无法选择子元素或拾取js点击事件。

Firefox / IE中是否有解决方法？

Answer 1

不建议在按钮内使用元素，因此您可以使用＆＃34; div＆＃34;而不是＆＃34;按钮＆＃34;这将使它在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>

http://jsfiddle.net/oh1mg7j6/8/

Answer 2

这不是一个好的风格。即使我说这种方式不对。你可以设置＆＃34;点击＆＃34;你的按钮上的事件点击输入。如果你想隐藏输入[文件]元素，但保持可点击你可以像我说的那样。这是一个非常好的链接事件文档和例子。

http://www.w3docs.com/learn-javascript/javascript-events.html

无法单击button元素中的input元素

2 个答案: