Question

我正在创建一个jQuery Mobile网站，并且正在努力解决一些基本概念。例如，我有一个带有导航按钮的页眉，例如“在地图上显示”。在它下面，我有一个包含项目的可折叠列表视图。当用户单击或展开列表视图项时，如何使其在单击导航按钮以在地图上显示时，将使用所选项的ID来更新地图。基本上，一个按钮的href取决于当前选择的内容。我该怎么处理？我应该使用第三方库来实现这个目标还是采用不同的方法？

Answer 1

假设您有一个处理地图显示的对象：

var Map = new ( function() {
   this.selectedItem = null;
   this.changeSelectedItem = function( itemID ) {
      this.selectedItem = itemID;
   }
   this.displaySelectedItem = function() {
      // display item here using this.selectedItem

   }
} )();

如果您有这样的列表项：

<li class="listItems" data-id="1">Some Item</li>

然后你可以附上这样的处理程序：

$( '.listItems' ).click( function() {
   var itemID = $( this ).data( 'id' );
   Map.changeSelectedItem.call( Map, itemID );
} );

通过这种方式，您将UI事件处理程序附加到Map对象的changeSelectedItem方法。您可以类似地将displaySelectedItem方法附加到UI处理程序。这有意义吗？

如何根据所选的列表视图项使按钮的行为不同？

1 个答案: