Jquery以编程方式更改<p>文本</p>

时间:2012-05-07 17:00:03

标签: javascript jquery html5 jquery-mobile

编辑:解决方案是将其添加到个人资料页面而不是性别页面。

$('#profile').live( 'pageinit',function(event){
$('p#pTest').text(localStorage.getItem('gender'));

});

我在listview中有一个带有som文本的段落,我想在clikcing save之后以编程方式从另一个页面进行更改。

编辑:这是我在profile.html中的列表视图。当您点击该项目时,您将转到另一个页面,您可以在其中保存您的性别。我想将此列表视图中的段落更改为从其他页面更改的性别。

<ul data-role="listview"   >
    <li><a href="gender.html">
        <img src="images/gender2.jpg" />
        <h3>Gender</h3>
        <p id="pTest">Male</p>
    </a></li> </ul>

性别html页面只是两个单选按钮和一个保存按钮的基本内容。 这是我的javascript代码(在单独的文件中):

$('#gender').live('pageinit', function(event) {

    var gender = localStorage.getItem('gender');
    var boolMale = true;
    if (gender == "female") boolMale = false;
    $('#radio-choice-male').attr("checked",boolMale).checkboxradio("refresh");
    $('#radio-choice-female').attr("checked",!boolMale).checkboxradio("refresh");

    $('#saveGenderButton').click(function() {
        if ($('#radio-choice-male').is(':checked'))
            localStorage.setItem('gender', "male");
        else localStorage.setItem('gender', "female");

        $('#pTest').html('test'); //does not work
         //$('p#pTest').text('test'); //does not work
         //$('#pTest').text('test'); //does not work
        $.mobile.changePage("profile.html");
    });
});

我已尝试使用javascript:$('p#pTest').text('test');

然而,文字没有改变。 (我知道保存按钮有效)。这可能吗?

3 个答案:

答案 0 :(得分:48)

请尝试以下操作,请注意当用户刷新页面时,值再次为“男性”,数据应存储在数据库中。

<p id="pTest">Male</p>
<button>change</button>

<script>
$('button').click(function(){
     $('#pTest').text('test')
})
</script>

http://jsfiddle.net/CA5Cs/

答案 1 :(得分:0)

“save”与使用jquery更改段落内容完全不同。

如果您需要保存更改,则必须以某种方式将它们写入您的服务器(可能形成提交以及所需的所有安全性和输入清理)。如果您有保存在服务器上的信息,那么您不再更改段落的内容,而是绘制带有动态内容的段落(来自数据库或服务器在您执行“保存”时更改的文件) 。

根据您的问题判断,这是一个您将不得不做更多研究的主题。

输入页面(input.html):

<form action="/saveMyParagraph.php">
    <input name="pContent" type="text"></input>
</form>

保存页面(saveMyParagraph.php)和输出页面(output.php):

Inserting Data Into a MySQL Database using PHP

答案 2 :(得分:0)

您的点击事件似乎包含在自定义事件名称&#34; pageinit&#34;,您确定在点击按钮之前触发了该事件吗?

类似的东西:

$("#gender").trigger("pageinit");