3

JQ と JQM を使用して phonegap アプリに取り組んでいますが、この 1 つの奇妙な問題に本当に困惑しました。私が得ることができるすべての助けを本当に使うことができました、ありがとう！

説明するのは難しいですが、この 2 つのイベント ハンドラーがほぼ同一に見える場合、2 つの動的バインド イベント ハンドラーで .data() を同様に機能させることができませんでした。私はどこかで何かを逃したに違いない..ため息..

HTML 

            <ul data-role="listview" id="notelist" data-split-icon="minus" data-split-theme="c">
                <li id="entrytemplate" style="display:none">
                    <a class="btnpopupdetails" href="#" data-position-to="window" data-rel="popup" data-transition="pop">
                        <h3>TEMPLATE Faulty lift</h3>
                        <p>TEMPLATE Lift A1, at lobby, Skyscraper Plaza, was reported broken down on 25th Dec 2012</p>
                    </a>
                    <a class="btndelete" href="#" data-position-to="window" data-rel="popup" data-transition="pop">Delete</a>
                </li>
            </ul>

JS

// row is a single row from a resultset of a successful sql query

newrow.data('rowid', row.id); // integer

newrow.data('rowtitle', row.txttitle); // text

newrow.data('rowdescription', row.txtdescription); // text

console.log(newrow.data('rowtitle')); // value retrieved and displayed fine!

console.log(newrow.data('rowdescription')); // value retrieved and displayed fine!

newrow.appendTo('#notelist');

newrow.find('h3').text(row.txttitle);

newrow.find('p').text(row.txtdescription);


newrow.find('.btnpopupdetails').click(function() {

  selectedrow = $(this).parent();

  selectedrowid = selectedrow.data('rowid');

  selectedrowtitle = selectedrow.data('rowtitle');

  selectedrowdscription = selectedrow.data('rowdescription');

  console.log(selectedrow.data('rowid')); // "TypeError: 'undefined' is not an object"

  console.log(selectedrow.data('rowtitle')); // "TypeError: 'undefined' is not an object"

  console.log(selectedrow.data('rowdescription')); // "TypeError: 'undefined' is not an object"
});


newrow.find('.btndelete').click(function() {

  selectedrow = $(this).parent();

  selectedrowid = selectedrow.data('rowid');

  selectedrowtitle = selectedrow.data('rowtitle');

  selectedrowdscription = selectedrow.data('rowdescription');

  console.log(selectedrow.data('rowid')); // value retrieved and displayed fine!

  console.log(selectedrow.data('rowtitle')); // value retrieved and displayed fine!

  console.log(selectedrow.data('rowdescription')); // value retrieved and displayed fine!
4

1 に答える 1

0

私は何が起こっているのか考えています：jQMがリンクのマークアップを強化する<a>と、<li>実際には2つのdivに含まれます。ページが読み込まれた後にマークアップを調べて、これを確認します。マークアップをにロードする<li>と、最初のマークアップ<a>は2 divに包まれて表示され、2番目のマークアップはその直接の子である<li>ため、これはあなたが見ている動作を説明します。

これは、あなたがデータを添付したのではなく、selectedrow = $(this).parent();あなたを含むdivを示しているのではないかと私が疑うことを示すことを意味します。<a class="btnpopupdetails"><li>

代わりに、その行を次のように置き換えてみてselectedrow = $(this).closest('li');ください。または<li>、新しいクラスを指定して使用します。$(this).closest('.newClass')

それを試してみて、それがどのように機能するかを教えてください。次のようになります（両方の要素に対して正しい1つのハンドラー）：

newrow.find('.btnpopupdetails, .btndelete').click(function() {  
  selectedrow = $(this).closest('li');    // THIS HAS CHANGED!
  selectedrowid = selectedrow.data('rowid');
  selectedrowtitle = selectedrow.data('rowtitle');
  selectedrowdscription = selectedrow.data('rowdescription');
  console.log(selectedrow.data('rowid')); // "TypeError: 'undefined' is not an object"
  console.log(selectedrow.data('rowtitle')); // "TypeError: 'undefined' is not an object"
  console.log(selectedrow.data('rowdescription')); // "TypeError: 'undefined' is not an object"
});
于 2012-11-30T18:04:24.967 に答える