Question

我有一个列表视图，当我点击列表视图中的链接时，它会启动一个弹出窗口。出于简化目的，我省略了listview，并且只从一个按钮开始。

我想从导致弹出窗口显示的按钮中检索属性，在我的示例中，名为customAttr的属性。然后我想将值插入popupBasic。

以下是我的基本示例jQuery Mobile代码：

<a href="#popupBasic" data-rel="popup" customAttr="value">Basic Popup</a>

<div data-role="popup" id="popupBasic">
    <p>This is a completely basic popup, no options set.</p>
</div>

jsFiddle：http://jsfiddle.net/cPRCU/2/

通常当我使用jQuery（非移动）时，我更多地参与点击事件/打开弹出窗口/对话框。我希望能够阅读导致弹出窗口显示的按钮，我该怎么做？

Answer 1

向按钮添加点击处理程序似乎有效。在此处理程序中，在弹出窗口显示之前修改它：

$('a[data-rel="popup"]').click(function () {
    var link = $(this);
    var data = link.attr('customAttr')
    var popup = $(link.attr('href')); // assume href attr has form "#id"
    popup.append(($('<p />').text(data)));
});

这是一个通用处理程序，它支持具有多个按钮/弹出窗口的页面。如果某些按钮不应该有这种行为，我会在所需按钮中添加一个类，并使a[data-rel="popup"]选择器更具体。

请参阅小提琴：http://jsfiddle.net/cPRCU/3/

Answer 2

我是在listview上做的，因为它对你更有用。

对于ListView

您必须在列表视图中为<a>标记注册点击事件，如下所示。

$('#mylist a').bind('click', function(event){
});

同时，确保将数据存储在锚标记内，如下所示。 data-customattr这里的一切都很小。

e.g。

<a href="#popupBasic" data-rel="popup" data-customattr="value2" >Basic Popup 2</a>

现在，您可以在点击事件中阅读data-customattr的值，如下所示

$(this).data('customattr')

现在我假设您在弹出窗口中有<p>标记的ID。如下所示

  <p id="mypopup">This is a completely basic popup, no options set.</p>

使用ID可以替换弹出窗口的内容。

最终将所有内容整合在一起

$('#mylist a').bind('click', function(event){
    console.log($(this).text());
   $('#mypopup').html($(this).data('customattr'));
});

查看 live fiddle 作为工作示例http://jsfiddle.net/gFTzt/5/

对于按钮

如果您坚持使用按钮的示例，则声明一个ID为

的按钮

<a href="#popupBasic" data-rel="popup" id="mybutton" data-role="button" data-customattr="button value">button example</a>

如上所述，注册点击事件并阅读customattr值。

 $('#mybutton').bind('click',function(){
        alert($(this).data('customattr'));
 });

查看按钮和列表视图的{kbd> live fiddle 示例http://jsfiddle.net/gFTzt/5/

使用.attr（）

这里我使用data来获取值。如果没有数据属性，我们可以直接从锚标记中获取值，如下所示。

E.g。我们有一个锚标记如下。

<a href="#popupBasic" customattr="value1">Basic Popup 1</a>

我们可以使用value1阅读.attr()，如下所示。

$(this).attr('customattr')

以下是 Live fiddle 示例。

Answer 3

我遇到弹出窗口问题但我终于意识到弹出窗口需要在页面内部。我的弹出窗口是弹出链接所在的页面的兄弟，并且直到我将其移动为该页面的链接和子级的兄弟之后才显示。

打开Popup的jQuery Mobile get按钮

3 个答案:

对于ListView

对于按钮

使用.attr（）