web-dev-qa-db-fra.com

Jquery change le texte <p> par programmation

EDIT: La solution était d'ajouter ceci à la page de profil au lieu de la page de genre.

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

});

J'ai un paragraphe avec un texte dans une vue de liste que je souhaite modifier par programme à partir d'une autre page après avoir cliqué sur enregistrer.

EDIT: Ceci est ma vue de liste dans profile.html. Lorsque vous cliquez sur l'élément, vous accédez à une autre page où vous pouvez enregistrer votre sexe. Je souhaite remplacer le paragraphe de cette liste par le sexe qui a été modifié à partir de l'autre page.

<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>

La page html de genre n'est que des éléments de base avec deux boutons radio et un bouton d'enregistrement. Voici mon code javascript (dans un fichier séparé):

$('#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");
    });
});

J'ai essayé cela avec javascript: $('p#pTest').text('test');

Le texte ne change cependant pas. (Je sais que le bouton Enregistrer fonctionne). Est-ce possible?

javascriptjqueryhtml5jquery-mobile
35
oivindth

Essayez ce qui suit, notez que lorsque l'utilisateur actualise la page, la valeur est à nouveau "Homme", les données doivent être stockées dans la base de données.

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

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

http://jsfiddle.net/CA5Cs/

54
undefined

"enregistrer" est quelque chose de complètement différent de changer le contenu d'un paragraphe avec jquery.

Si vous devez enregistrer les modifications, vous devrez les écrire sur votre serveur d'une manière ou d'une autre (probablement la soumission du formulaire avec toute la sécurité et la désinfection des entrées que cela implique). Si vous avez des informations qui sont enregistrées sur le serveur, vous ne modifiez plus le contenu d'un paragraphe, vous dessinez un paragraphe avec un contenu dynamique (à partir d'une base de données ou d'un fichier que votre serveur a modifié lorsque vous avez fait l '"enregistrement") .

À en juger par votre question, c'est un sujet sur lequel vous devrez faire BEAUCOUP plus de recherches.

Page d'entrée (input.html):

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

Page de sauvegarde (saveMyParagraph.php) et page de sortie (output.php):

Insertion de données dans une base de données MySQL en utilisant PHP

0
Sinetheta

Il semble que l'événement de clic soit entouré d'un nom d'événement personnalisé "pageinit", êtes-vous sûr d'avoir déclenché l'événement avant de cliquer sur le bouton?

quelque chose comme ça:

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