3

Bootstrapモーダルに表示する次の形式の構造があります。

<div>
 <input type="text"/>
 <input type="text"/>
 <button class="jSomeButton" onclick="javascript: return false;"></button>
 <!--Click event handled in Javascript code-->
</div>

$(function(){
   $(".jSomeButton").on('click',function(){
      //Called from Firefox, Chrome and IE
      //Not called from Safari
   });
});

Firefox、Chrome、および IE では、入力後に Enter/Return キーを押すと、ボタンのクリックがトリガーされます。
しかし、Safari [v4.0.3] では、ボタンのクリックがトリガーされません! むしろ、同じページにポストバックするようです。

これは Safari の既知の問題ですか?
はいの場合、回避策はありますか？
いいえの場合、誰かが根本的な問題を解決するのを手伝ってくれませんか?

PS :
1. Enter keypress イベントでボタンのクリックをトリガーするための Javascript コードに精通しています。上記がSafariでのみ機能しない理由については、ただ興味があります。
2.明確にするために、タブを押して最初にボタンにフォーカスしてからEnterキーを押すのではなく、入力コントロールにいる間にEnterキーを押します。

4

3 に答える 3

3

入力フィールドとボタンをフォームに追加します。

これを使用してみてください。ただし、これが正しい方法であるかどうかはわかりません。その場合は、2 つの js リスナー関数を入力フィールドに追加することをお勧めします。なので

` 

  <div>
     <input id="one" type="text"/>
     <input id="two" type="text"/>
     <button class="jSomeButton" onclick="javascript: return false;">               </button>
     <!--Click event handled in Javascript code-->
    </div>



$('#one').keypress(function(e){
if(e.which == 13) {
//call your code

 }
});

$('#two').keypress(function(e){
if(e.which == 13) {
///call your code
 }
});

ボタン用に 1 つ、2 つの入力ファイル用に 2 つ、3 つのリスナーを作成することをお勧めします。この病気があなたを助けてくれることを願っています。この解決策についてはわかりません。試してから教えてください。

于 2013-08-19T05:18:52.150 に答える
0

class 属性の代わりに id 属性 onclick event を使用し、

<div>
 <input type="text"/>
 <input type="text"/>
 <button class="jSomeButton" id="jSomeButton" onclick="javascript: return false;"></button>
 <!--Click event handled in Javascript code-->
</div>


$(function(){
   $("#jSomeButton").on('click',function(){
      //Called from Firefox, Chrome and IE
      //Not called from Safari
   });
});

追加したくない場合は、定義されたクラスでイベントが機能するようにイベントを追加IDできます。delegatedocumentDOM

例

<script type="text/javascript">
$(function(){
    $(document).on('click', ".jSomeButton" ,function(){
        alert('works');
    });
});
</script>
于 2013-08-19T05:49:16.837 に答える
0

@ヴァンデッシュ、

コメントに投稿されているように、フォーム全体にフォーム タグを配置することをお勧めします。詳細については、この JSFiddle をご覧ください。

http://jsfiddle.net/JUryD/

Safari、Chrome、IE6+、Opera、Firefox 22+でこれを試しました

他に困っていることがあれば教えてください。

コードは次のとおりです。

<div>
 <form>            
  <input type="text"/>
  <input type="text"/>
  <button class="jSomeButton" onclick="javascript: return false;">Send</button>  
 </form>
</div>
于 2013-08-19T07:46:34.627 に答える