ipadで動作していないリストのdivをクリックするイベントをクリック

Question

Chrome上でonClickが正常に動作しているSenchaのリスト行にhtmlを追加しました& WindowsではSafariですが、iPadではクリックイベントは機能しません。 iPadでの実践例を教えてください。

煎茶フィドル例： http://www.senchafiddle.com/#MadlC#SPOJb#psFLV

コード：

var store = Ext.create('Ext.data.Store', { 
    fields: ['htmlRow'], 
    autoLoad: true, 
}); 

store.add([{ "htmlRow": "<div onclick='func_click1();' style='background:gray;width:70px;float:left'>Click 1</div><div onclick='func_click2()' style='background:yellow;width:70px;float:left'>Click 2</div>" }]); 
store.add([{ "htmlRow": "Edt"}]); 
store.add([{ "htmlRow": "Jamie"}]); 
store.add([{ "htmlRow": "Aaron"}]); 
store.add([{ "htmlRow": "Dave"}]); 
store.add([{ "htmlRow": "Michael"}]); 
store.add([{ "htmlRow": "Abraham"}]); 
store.add([{ "htmlRow": "Jay"}]); 

//define the application 
Ext.application({ 

    launch: function() { 

     Ext.Viewport.add({ 

      width: '100%', 
      height: '100%', 

      centered: true, 
      hideOnMaskTap: false, 

      layout: 'fit', 

      items: [{ 
       xtype: 'list', 
       disableSelection:true, 

       itemTpl: '<strong>{htmlRow}</strong>', 
       store: store 
      }] 
     }); 
    } 
}); 

function func_click1(){ 
    alert("Why This Click 1 Working on Safari and Google Chrome in Windows, But Not Working on Ipad !"); 
} 
function func_click2(){ 
    alert("Why This Click 2 Working on Safari and Google Chrome in Windows, But Not Working on Ipad !"); 
} 

Answer 1

、あなたがすることができます「イベント」パラメータを調べて、リスト項目のどの領域がタップされたかを判断します。あなたのケースでは、このような何かを行うことができます：

store.add（：

• 1）あなたの最初の行の2つのdiv要素にIDを追加[​​{ "htmlRow"： "<div id='area1' onclick='func_click1();' style='background:gray;width:70px;float:left'>Click 1</div><div id='area2' onclick='func_click2()' style='background:yellow;width:70px;float:left'>Click 2</div>"}] ）;

• 2）itemtapリスナーで：

  itemtap : function(list, index, target, record, event) { 
      console.log(event.target.id); 
      if (event.target.id=='area1') { 
       alert('area1 clicked!'); 
      } 
      if (event.target.id=='area1') { 
       alert('area2 clicked!'); 
      } 
  } 
  

注はるかに情報があることを必要に応じて 'イベント'パラメータを設定します。

これが役に立ちます。

Answer 2

理由は、それがために設計されたように「のonclick」、タップ入力デバイス（Iデバイスをタッチ意味）で使用することができないことですクリックは名前の状態として表示されます。

行がリストにタッチしたときのフィードバックを得るために（ST2）適切な方法は、あなたのリストの「itemtap」イベントに耳を傾けることです。「itemtap」イベントで

... 
items: [{ 
      xtype: 'list', 
      disableSelection:true, 

      itemTpl: '<strong>{htmlRow}</strong>', 
      store: store, 
      listeners: { 
       itemtap : function(list, index, target, record, event) { 
        // your code here 
       } 
     }] 
...