web-dev-qa-db-ja.com

jqueryはプログラムで<p>テキストを変更します

編集:解決策は、これを性別ページではなくプロファイルページに追加することでした。

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

});

リストビューにSOMテキストを含む段落があり、保存をクリックした後に別のページからプログラムで変更したい。

編集:これは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ページは、2つのラジオボタンと1つの保存ボタンを備えた基本的なものです。ここに私の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');

ただし、テキストは変更されません。 (保存ボタンが機能することは知っています)。これは可能ですか?

35
oivindth

以下を試してください。ユーザーがページを更新すると、値が再び「男性」になり、データがデータベースに保存されることに注意してください。

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

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

http://jsfiddle.net/CA5Cs/

54
undefined

「保存」は、jqueryで段落の内容を変更することとはまったく異なるものです。

変更を保存する必要がある場合は、何らかの方法でそれらをサーバーに書き込む必要があります(フォーム送信とそれに伴うすべてのセキュリティと入力サニタイズの可能性が高い)。サーバーに保存されている情報がある場合、段落のコンテンツを変更することはありません。動的コンテンツを含む段落を描画しています(「保存」を行ったときにサーバーが変更したデータベースまたはファイルから) 。

あなたの質問から判断すると、これはあなたがより多くの研究をしなければならないトピックです。

入力ページ(input.html):

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

保存ページ(saveMyParagraph.php)および出力ページ(output.php):

PHPを使用してMySQLデータベースにデータを挿入する

0
Sinetheta

カスタムイベント名 "pageinit"の周りにクリックイベントがラップされているように見えますが、ボタンをクリックする前にイベントをトリガーしたことを確認してください。

このようなもの:

$("#gender").trigger("pageinit");
0
Juan Leung