Question

我正试图在两页之间传递数据。

这是我到目前为止所拥有的： http://jsfiddle.net/8JXTT/49/

所以我在第二页上设置一个属性：$（“＃secondpage”）。attr（“val”，“test value”）;

要访问此属性，我使用：var val1 = $（this）.attr（'val'）;

但是对于每个'Link Button'，值应该是不同的。

在这个小提琴中，当我在按钮上设置属性时，我在页面上设置属性？

如何修改代码以传递与每个按钮关联的唯一值，以便在按下按钮时该值可在后续页面上访问。

小提琴代码：

HTML

<div data-role="page" id="firstpage">
    <div data-role="header">
         <h1>First Page</h1>
    </div>
    <div data-role="content" id="links"></div>
    <div data-role="footer">
         <h4>Page Footer</h4>
    </div>
</div>
<div data-role="page" id="secondpage">
    <div data-role="header"> <a href='#' class='ui-btn-left' data-icon='arrow-l' onclick="history.back(); return false">Back</a>
        <h1>Bar</h1>
    </div>
    <div id="pagecontent" data-role="content"></div>
    <div data-role="footer">
         <h4>Page Footer</h4>
    </div>
</div>

JS

$(document).ready(function () {

    for (var i = 0; i < 4; i++) {

        var button = '<a data-role="button" href="#secondpage" data-theme="c" class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-c"><span class="ui-btn-inner ui-btn-corner-all"><span class="ui-btn-text">Link Button</span></span></a>';

        $('#links').append(button);

        $("#secondpage").attr("val", "test value");
    }

    $('#secondpage').live('pageshow', function () {
        var val1 = $(this).attr('val');
        $("#pagecontent").html(val1);
        console.log('val is ' + val1);
    });

});

Answer 1

我发现您的代码有几个问题：

您在创建按钮时直接设置val的值，而不是在按下按钮后设置值。
您应该使用$.data来设置数据
棘手的问题是，当您为按钮创建onclick处理程序时，您可能会无意中创建一个“闭包”，这意味着所有单击处理程序将使用i的相同值（最后一个值集）。 / LI>
要解决此问题，您需要 1.将单击事件绑定到将设置页面数据的新按钮 2.创建一个方法来创建一个超出循环范围的按钮，并从循环中调用它

看看更改后的代码，应该可以正常工作 http://jsfiddle.net/azZVk/12/ 另外，了解一些关于闭包的信息对你有好处。看一下这个问题，例如： JavaScript closure inside loops – simple practical example

在jQuery mobile中按下按钮传递数据

1 个答案: