problème: j'ai eu un petit problème avec ceci.Isu est arrivé lorsque j'ai créé 2 fichiers HTML (comme pour une catégorie de livres différente) avec la même différence de code uniquement dans le nom de livres.say Le HTML 1 a le [livre de données A], [livre B], Le problème est quand j'ai ouvert HTML 2 et il n'a pas de [Booka], [Brochure] et j'ai sélectionné [Bookc] puis localStorage réinitialiser et enregistre uniquement [Bookc].
Pouvez-vous m'aider à résoudre ce problème. Merci d'avance Je ne sais pas combien de mises à jour sont autorisées à une seule question.Si c'est faux modérateurs, veuillez pardonner éditer (vieux): peut me dire quel changement de jQuery for Obtenir du travail de code dans des cas ci-dessous. becauses code ne fonctionne pas lors de l'ajout de multiples TD sous le même TR
En outre, ne fonctionne pas quand j'ai quelque chose sur les caractères Unicode.
Je ne veux que le code de série sauvegardé sur localStorage et Retreprise en l'identifiant Comment puis-je faire cela se produire: Lorsque l'utilisateur sélectionne Ajouter à l'image favorite ou quelque chose comme un bouton, il devient jaune (ajouté aux favoris). Et l'élément favorisé doit être placé au-dessus de l'élément non conçu. La table est enregistrée en localStorage.
peut-il être obtenu en utilisant le script localStorage ou JQuery?
3 Réponses :
<script>
$(document).ready(function()
{
$(".fav").click(function()
{
if($(this).children("img").prop("src")=="unfav.png")
{
$(this).children("img").prop("src", "fav.png");
}
else
{
$(this).children("img").prop("src", "unfav.png");
}
});
});
</script>
Remove any one image in .fav < div >
Est-ce l'effet que vous êtes après? Ensuite, vous devez p> bascule () code> les étoiles sur Cliquez sur CODE>.
J'ai utilisé JQuery pour la facilité de démonstration. Il peut facilement être traduit en JS vanilla.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="vars_table">
<tr>
<td>cat</td>
<td>
<div class="fav">
<img class="white-star" src="https://cdn.clipart.email/9bfb21466fc07c2f2795fce51bb5ee4f_28-collection-of-star-clipart-transparent-background-high-_299-270.png" />
<img class="yellow-star hide" src="https://cdn.clipart.email/d09d2061abdc8c1316827ecafedacf01_stars-clipart-on-transparent-background-clipartxtras_7628-7405.png" />
</div></td>
</tr>
<tr>
<td>duck</td>
<td>
<div class="fav">
<img class="white-star" src="https://cdn.clipart.email/9bfb21466fc07c2f2795fce51bb5ee4f_28-collection-of-star-clipart-transparent-background-high-_299-270.png" />
<img class="yellow-star hide" src="https://cdn.clipart.email/d09d2061abdc8c1316827ecafedacf01_stars-clipart-on-transparent-background-clipartxtras_7628-7405.png" />
</div></td>
</tr>
<tr>
<td>goose</td>
<td>
<div class="fav">
<img class="white-star" src="https://cdn.clipart.email/9bfb21466fc07c2f2795fce51bb5ee4f_28-collection-of-star-clipart-transparent-background-high-_299-270.png" />
<img class="yellow-star hide" src="https://cdn.clipart.email/d09d2061abdc8c1316827ecafedacf01_stars-clipart-on-transparent-background-clipartxtras_7628-7405.png" />
</div></td>
</tr>
<tr>
<td>foo</td>
<td>
<div class="fav">
<img class="white-star" src="https://cdn.clipart.email/9bfb21466fc07c2f2795fce51bb5ee4f_28-collection-of-star-clipart-transparent-background-high-_299-270.png" />
<img class="yellow-star hide" src="https://cdn.clipart.email/d09d2061abdc8c1316827ecafedacf01_stars-clipart-on-transparent-background-clipartxtras_7628-7405.png" />
</div></td>
</tr>
<tr>
<td>bar</td>
<td>
<div class="fav">
<img class="white-star" src="https://cdn.clipart.email/9bfb21466fc07c2f2795fce51bb5ee4f_28-collection-of-star-clipart-transparent-background-high-_299-270.png" />
<img class="yellow-star hide" src="https://cdn.clipart.email/d09d2061abdc8c1316827ecafedacf01_stars-clipart-on-transparent-background-clipartxtras_7628-7405.png" />
</div></td>
</tr>
<table>
Mais comment l'article favorisé peut-il afficher sur la table supérieure et modifiée, économiser dans localStorage?
@Davidbeckam Gardez un objet dans le localStorage pour stocker votre STATI et les mettre à jour surCliquez. J'ai mis à jour mon extrait ci-dessus, mais cela ne sera pas exécuté dans JS Fiddle en raison de restrictions de sécurité. Mais le code fonctionne.
@Davidbeckam génial, vous pouvez alors accepter la réponse pour référence future.
Voici comment déplacer et enregistrer
Le HTML doit être valide (je devais corriger votre p> table> code>) p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="ratingTable" id="table1">
<tr>
<td data-id="Book A">à´²àµà´²àµ†à´™àµà´•à´¿àµ½ (Eg For Book name in another lang )</td>
<td style="display:none" class="serial-code">book-dais</td>
<td>
<div class="fav">
<img class="white-star" src="https://i.postimg.cc/g0b9JG0w/unfav.png" />
<img class="yellow-star hide" src="https://i.postimg.cc/QN1T9bSH/fav.png" />
</div>
</td>
</tr>
<tr>
<td data-id="Book B">The chair by Jhon</td>
<td style="display:none" class="serial-code">book-jhon</td>
<td>
<div class="fav">
<img class="white-star" src="https://i.postimg.cc/g0b9JG0w/unfav.png" />
<img class="yellow-star hide" src="https://i.postimg.cc/QN1T9bSH/fav.png" />
</div>
</td>
</tr>
<tr>
<td> ലോഡൠ</td>
<td data-id="Book C" style="display:none" class="serial-code">book-lady</td>
<td>
<div class="fav">
<img class="white-star" src="https://i.postimg.cc/g0b9JG0w/unfav.png" />
<img class="yellow-star hide" src="https://i.postimg.cc/QN1T9bSH/fav.png" />
</div>
</td>
</tr>
</table>
Les commentaires ne sont pas pour une discussion prolongée; Cette conversation a été déplacé vers chat < / a>.
S'il vous plaît visitez le centre d'aide pour voir quoi et Comment demander . Astuce: post-effort et code. Je t'ai fait un extrait. Veuillez ajouter vos efforts de codage au volet JavaScript et ajouter des images de Placeholder.com et de certains CSS dans un exemple minimal reproductible
Merci d'avoir souligné les erreurs de poser des questions.
Pouvez-vous s'il vous plaît mettre à jour la question avec vos efforts?
@MPLUGJAN SIR I Mise à jour de la question, veuillez vous référer