防止点击文件输入的标签打开文件浏览器 [英] Prevent clicking on file input's label from opening file browser

问题描述

我有一个表单，用户可以上传图片，我为每个输入使用< label> s。但是，在这种特殊情况下，当用户单击标签元素时，打开文件浏览器并不理想。我试过在标签上使用jQuery的 preventDefault ，但它不起作用。任何方式来禁用此功能？我仍然喜欢用标签来代替其他元素。

$ p> < div class =control-group>
< label for =userImagesclass =nodefault>请上传图片< / label>信范范中范范内范范内范范内范亦
< input type =fileid =userImagesname =userImages/>
< / div>
< div>


和我的JS：

（$）$（$）$（$） b}）; 
}）; 
  

我正在使用：

jQuery v1.10.1

jQueryUI v1.10.3

Twitter Bootstrap v2.3.2

解决方案

c $ c> .ready（）缺少）最后

（$）$（$）$（$） b}）; 
}）; 
  

工作正常这里

I have a form where users can upload images, and I'm using <label>s for each input. However, in this particular case it's not desirable for the file browser to open when a user clicks on the label element. I've tried using jQuery's preventDefault on the labels, but it doesn't work. Any way to disable this functionality? I'd still like to stick with labels instead of replacing them with other elements.

My HTML:

<div class="control-group">
    <label for="userImages" class="nodefault">Please upload images</label>
    <div class="controls">
        <input type="file" id="userImages" name="userImages" />
    </div>
<div>

and my JS:

$(document).ready(function() {
    $(".nodefault").click(function(e) {
        e.preventDefault();
    });
});

I'm using:
jQuery v1.10.1
jQueryUI v1.10.3
Twitter Bootstrap v2.3.2

解决方案

You have a Typo in .ready() missing ) in the end

$(document).ready(function() {
    $(".nodefault").click(function(e) {
        e.preventDefault();
    });
});

Works fine Here

这篇关于防止点击文件输入的标签打开文件浏览器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！