2017-10-01 4 views
1

私のような入力ボタンを使用してJavaScript関数への呼び出しを見ることに使用しています:私はJavaScriptに新しいです、私はこのような多くのものを使用したJavaScriptプログラマーに気づいJavaScriptプログラマはモバイルデバイス用のHTML入力ボタンを使用しないでください。 HTMLで

<input type="button" value="Click Here" onclick="myclick()"></TD> 

$(document).ready(function(){ 
      $("#tapDiv").hide(); 
... 
... 
...    
       "onload": function() { 
        $("#tapDiv").show().click(function(){ 
         $("#tapDiv").hide(); 
<div id="tapDiv" style='padding:10px;'>Tap to start.</div> 

モバイルデバイスの場合、HTML入力ボタンの使用を避け、上記のJavaScriptが行うことを実行する方がよいでしょうか?私は、PHPのプログラムで使用するためにHTMLの入力ボタンを使用することに使用していますが、プログラマはJavaScriptを使用していないように見えます。特にモバイルデバイスの場合はそうです。

これには理由がありますか?これにより、Webページ上のイベントをより詳細に制御できますか?これはゲーム開発のために良いですか?その他のメリット私はJavaScriptとjQueryを学習しているので、私は注意すべきことはありますか?

+0

いいえ意味値のために、 'div'要素の代わりに' 'や'

+0

しかし、はい、イベントリスナーをJSファイルに配置し、htmlの 'onclick'属性を使用しないでください。 – Bergi

+0

(Btw、特にモバイルデバイスとは関係ありません。デスクトップブラウザにとってもベストプラクティスです) – Bergi

答えて

5

ボタン要素は相互作用するように設計されています。デフォルトでは、それらは、ユーザがポインティングデバイス/タッチスクリーンを使用しない人々がそれらと相互作用することができるように、タブ順の自然な位置をクリックすることができるユーザに知らせるルックアンドフィールと、画面読者がユーザーに活動化できるものがあることを伝えるために使用できるセマンティクス。

Div要素は汎用ブロックコンテナです。彼らの仕事は、より良いセマンティクスを持つ要素が存在しないときにコンテンツを含めることです。


つまり、提供した2つのコード例には別の大きな違いがあります。

組み込みのイベント属性の代わりにJavaScriptを使用するイベントハンドラをバインドするのが一般的なベストプラクティスと考えられます。

  • それseparates concerns
  • それはそれはあなたが(名前空間の衝突を避ける)グローバルを作成しないようにスコープにあなたの機能をIIFEsを使用することができますいくつかのnasty gotchas
  • を回避することができます。この

なしに、特定のまたはモバイル機器の存在によって変更されません。

+0

私はJavaScriptを初めて使用しているので、ベストプラクティスと考えるJavaScriptのバインディングイベントハンドラの実際の例を教えてください。 –

+0

@EdwardCoast - Err。あなたの質問のコード。 – Quentin

+0

ボタン上のバインディングイベントハンドラに相当するのは、onclickではないからです。これはそれだろうか? https://www.w3schools.com/js/js_htmldom_eventlistener.asp –

関連する問題