6

ファイルを送信するためのフォームinputがありますが、ネイティブスタイルが気に入らなかったため、スタイルを設定しました。これで、ボタンを1つクリックすると、ファイルを選択するためのダイアログが開きます。FirefoxとChromeを1回クリックするだけで正常に動作しますが、IEでは動作しません。IEでダイアログを開くには、ボタンをダブルクリックする必要があります

jQueryを使用してシングルクリックでダブルクリックをトリガーしようとしました:

$("input").click(function() { 
    $(this).dblclick(); 
});

ただし、機能していないようです。IEのダブルクリックをトリガーする他のアプローチはありますか?

デモは次のとおりです:http://jsfiddle.net/HAaFb/

4

8 に答える 8

3

このようなものはどうですか?

var count=0;
$("input").click(function(e) { 
    count++;
    if(count==2){
         count=0;
    }else{
        e.preventDefault();
    }
});

デモ:http: //jsfiddle.net/HAaFb/1/

http://jsbin.com/ukotit/17/edit

于 2013-03-11T16:44:31.403 に答える
3

jQueryファイルアップロードデモページが実際にファイル入力フィールドを(「非表示」のときに)再配置して、[参照]ボタンが[ファイルの追加]ボタンの領域内に適切に配置されることを発見しました。そのため、IE 8/9/10でそのボタンをクリックすると、シングルクリックで開きます。

http://blueimp.github.io/jQuery-File-Upload/

私が見る1つのCSSで:

.fileinput-button input {
...
right: 0px;
...
transform: translate(300px, 0) scale(4);
}
于 2013-06-07T15:44:31.997 に答える
2

答えは、dblclickをトリガーすることではなく、IEでファイルダイアログを開くことです...そうですか?だから私は解決策はファイル入力のクリックをトリガーすることだと思います(どちらが非表示になりますか?)

$("#formId").find("input[type='file']").trigger('click');

あなたのフィドルでは、私はこれを行います:

$("input").click(function() { 
    $('input[type="file"]').click(); 
});

これを試してみます

$('input[type="file"]').hide().parent().append($('<span />').attr('class', 'filebutton').text('Upload'));
$(".filebutton").click(function() { 
    $('input[type="file"]').click(); 
});

このCSSで

form {
    color:#666;
}
.filebutton {
    content:'upload';
    font:small-caps 15px Georgia;
    letter-spacing:1px;
    border-radius:10px;
    border:1px solid #eee;
    width:100px;
    padding:10px;
    margin:20px;
    text-align:center;
    position:absolute;
    left:0;
    top:0;
    z-index:1;
    background-color:#f8f8f8;
}

.filebutton:hover {
    background-color:#f3f3f3!important;
    color:#c00;
     cursor : pointer;
}

そしてそれは動作します...

于 2013-03-11T16:49:35.940 に答える
1

ファイル入力はIEのネイティブ/ActiveXコンポーネントであるため、それらに対してイベントを実行することはできません。選択した入力の場合と同じです。

本当にダブルクリックが必要なのは何ですか?

于 2013-03-11T16:48:26.897 に答える
1

私はおそらくパーティーに遅れていることを知っていますが、誰かがこの投稿に遭遇した場合に備えて、私はこれで同様の問題を解決することができました:

$("#uploadInput").bind('mousedown', function (event) {
    $(this).trigger('click')
});

IE10とIE11の両方で動作しました。

于 2015-06-16T12:31:15.093 に答える
0
$("input").click(function() { 
    $(this).trigger('dbclick');
});
于 2013-03-11T16:44:20.397 に答える
0

私はこれをチェックしていませんが、次のようなものを使用する必要があると思います。

$('input').on('click', function() {
  $(this).trigger('dblclick');
});

ばかげていないことを願っています、ハハ。

于 2013-03-11T16:47:12.960 に答える
0

これはCSSです...IEで不透明度とクリップを無効にすると、実際の参照ボタンが右側に表示されます。

filter:opacityがIE9で使用されていないことを確認してください。これは、私のために機能しました。JSFiddleはIE7/8では動作しないため、テストできませんでした。

于 2013-03-11T16:56:20.120 に答える