0

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

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

所以我在第二页上设置一个属性： $("#secondpage").attr("val", "test value");

为了访问这个属性，我使用： var val1= $(this).attr('val');

但是对于每个“链接按钮”，值应该是不同的。

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

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

小提琴代码：

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);
    });

});
4

1 回答 1

1

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

  1. 您在val创建按钮时直接设置值，而不是让按钮在单击后设置值。
  2. 您应该使用$.data来设置数据
  3. 棘手的问题是，当您为按钮创建 onclick 处理程序时，您可能会无意中创建一个“闭包”，这意味着所有单击处理程序将使用相同的值（最后一个值集）i。

要解决此问题，您需要 1. 将单击事件绑定到将设置页面数据的新按钮 2. 创建一个方法来创建一个超出循环范围的按钮，并从循环中调用它

看看更改后的代码，它应该可以工作 http://jsfiddle.net/azZVk/12/ 另外，了解一些关于闭包的知识会对您有所帮助。看看这个问题，例如： JavaScript 闭包内循环 - 简单实用的例子

于 2012-07-19T15:06:05.317 回答