3

使用 JQ 和 JQM 开发 phonegap 应用程序，这 1 个奇怪的问题真的把我难住了。我真的可以使用我能得到的所有帮助，谢谢大家！

有点难以解释，但是当这 2 个事件处理程序看起来几乎完全相同时，无法让 .data() 在 2 个动态绑定事件处理程序中类似地工作。我一定是在什么地方漏掉了什么……叹息……

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 中，第二个是 的直接子级，<li>因此这可以解释您所看到的行为。

这意味着当您表示selectedrow = $(this).parent();我怀疑它表示包含您<a class="btnpopupdetails">的而不是<li>您附加数据的 div 时；

而是尝试用这个替换该行：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 回答