jquery html($(“<img>”).attr(“src”, cette.href)); ne fonctionne pas sous Safari

Je suis à l'aide d'une simple fonction jquery pour une galerie d'images. Il y a un div de vignettes, puis la cible div où les grandes images sont chargées dans après on clique sur une vignette.

Ça fonctionne dans tous les navigateurs, à l'exception de Safari, où l'image de l'url absolue est chargé, plutôt que d'être chargé à l'intérieur de la div.

Voici le code jquery:

$("#thumbnails a").click(function() {
    $("#work").html($("<img>").attr("src", this.href));

    return false;
});

Toute pensée? Grâce

InformationsquelleAutor jonathonthoma | 2011-01-21

jquery safari

2

this.href n'est pas sûre!

Utilisation $(this).attr('href') et il va fonctionner.

Découvrez ma question ici: Récupérant les HTML les valeurs de l'attribut "le DOM 0 chemin"

Il explique qu'il y a plusieurs attributs HTML (href d'entre eux) qui sont problématiques, donc on doit utiliser du jQuery attr() pour récupérer leurs valeurs.

Citation de la réponse sur cette page:

Par exemple, le href de la propriété d'un
élément toujours des rapports entièrement
URL tandis que
getAttribute("href") sera de retour le
chaîne spécifiée dans le code HTML href
attribut de mot à mot. Sauf, bien sûr,
dans IE. jQuery attr() tente de
normaliser ce type d'incohérence.

Mise à JOUR

J'ai tout compris. Vous n'avez pas de s'assurer que le jQuery, le code s'exécute après que le DOM est prêt. Toujours placer toutes vos jQuery code à l'intérieur du prêt gestionnaire:
```
$(function() {

    //place all jQuery code here

});
```
Mise à JOUR 2

Essayez ce code:
```
$('#thumbnails a').click(function() {
    $('#work').empty().html( '<img src="' + $(this).attr('href') + '">' );
    return false;       
});
```
J'aurais vu ça plus tôt. L'argument de l'html() la fonction doit être une chaîne de caractères.

Mise à JOUR 3

Il se pourrait que Safari (au moins) ne pas exécuter du code JavaScript dans une page qui est entièrement chargé via jQuery méthode load ().

Cependant, je pense que j'ai compris la façon de traiter avec elle!

Sur le 1776.php page, déplacez l'élément de SCRIPT à partir de la TÊTE sur le CORPS du document.
```
<body>
    <script> ... the code ... </script>
    <div> ... </div>
</body>
```
- Comment dois-je incorporer à l'intérieur de l' .html()la fonction et/ou <img> tag?
- Il suffit de remplacer this.href avec $(this).attr('href')
- C'est ce que j'ai fait (il ne marche pas): $("#travail").html($("<img>").attr("src", $(this).attr("href"))); return false;
- Ce qui se passe dans Safari? La page web remplacé par l'image?
- Ouais, c'est vrai. Ce code est comme ça dans tous les navigateurs maintenant.
- Ne les navigateurs signaler une erreur? Il semble que vous avez fait une erreur dans le code JavaScript qui désactive le même gestionnaire.
- J'ai couru à firebug et regardé dans ma console d'erreur, la réception de 0 erreurs...voici un lien vers la page que je suis en train de travailler sur: cprandpartners.com/work/1776.php
- Vous devriez avoir fourni ce lien dès le début. Il m'a fallu 10 secondes pour comprendre. :)
- Haha, j'ai pensé que c'était quelque chose de facile. Quel est-il?
- Voir ma réponse. J'ai mis à jour.
- Cela ne fonctionne pas :/ Il fonctionne dans firefox, mais toujours en panne dans Safari
- Il fonctionne dans mon Safari 5. Ce Safari version de vous tester dans?
- Je suis dans safari 5.0.3....testé sur quatre ordinateurs différents dans safari. Rien de bon dans l'un d'eux :/
- Sont ceux de Mac? Je suis sur Windows 7.
- 3 sont mac, un est en cours d'exécution XP. Sur chacun d'eux, l'image que j'ai chargé directement par son adresse URL dans une nouvelle fenêtre. Dans firefox, les images de la charge dans le #travail div, comme ils sont destinés à
- Ok, je crois que j'ai maintenant 🙂 Voir mon jour de réponse.
- Aussi, découvrez la dernière version de jQuery 1.4.4
- Qui a fonctionné...je vais avoir ce problème, qui je ne pense pas que se matière, mais apparemment ne. 1776.php est chargé dynamiquement par le biais de cprandpartners.com/work/home.php, et à l'intérieur de home.php il a encore la question qu'il a été saisi. Cliquez sur design> 1776 Vêtements> ensuite, essayez d'utiliser le script. Des idées?
- Comment êtes-vous de l'insertion 1776.php en home.php?
- fonction c1776() { $('#container').html('<p align="center"></p>'); $('#container').css({'droit' : '900px'}); $('#container').charge("1776.php"); $("#conteneur").stop().animate({ droite:'0px' },{file:false, durée:500, easing: 'linear'}); }
- Le problème est présent que si vous ouvrez 1776.php directement dans Safari? (Avons-nous résoudre le problème d'origine?)
- Oui, nous avons fait. Il se produit seulement une fois 1776.php est chargé à l'intérieur de home.php
- Avez-vous accidentellement revenir à l'ancien code? Je demande parce que l'1776.php page - cprandpartners.com/work/1776.php - contient votre code d'origine, et non le code que j'ai posté dans ma mise à JOUR 2.
- Vous avez raison. Il a fait revenir dans une récente mise à jour..mais c'est le retour à votre code, et encore en fonctionnement le même (ou le manque de)
- Vous avez un copier-coller de l'erreur (je suppose): l'un des trois )}; à la fin doit être déplacé à droite après return false; Il ressemble à: jsfiddle.net/gD78L
- J'ai enlevé le script de redimensionnement pour des raisons de simplicité. Maintenant c'est juste le code que nous recherchons. Toujours obtenir le même résultat.
- Il semble que Safari (au moins) ne pas exécuter le code JavaScript sur une page qui est chargé dans une autre page via load(). Découvrez cette question: stackoverflow.com/questions/889967/...
- Je suis enfin en mesure de faire l'expérience de votre problème dans mon Safari. Qui rendront plus facile pour résoudre le problème.
- OK, je crois que j'ai enfin compris. Vue mise à JOUR 3 dans ma réponse.
- J'ai tout enlevé, à l'exception de ce qui est dans le corps des balises et inclus jquery à l'intérieur de cette zone. A travaillé comme un charme. Merci à tous pour votre aide
- Oui, tant que le SCRIPT élément est pas à l'intérieur de l'élément de TÊTE, le code JavaScript à exécuter.
- la droite. j'ai lu l'article que vous avez envoyé. merci encore homme.
- J'ai ouvert une question d'aborder ce comportement dans Safari: stackoverflow.com/questions/4787457/...
InformationsquelleAutor Šime Vidas

$("#thumbnails a").click(function() {
      $('#work').empty().append($('<img>', {
           src:   this.href
      }));
      return false;
});

Ce code ne semble pas juste. .attr( est manquant
Vous avez un ) au lieu d'un , après '<img>'.

InformationsquelleAutor jAndy

0

Je de se confondre au large de la this.href parce que tout votre dans l'attribut $("#work").

essayez ceci:
```
$("#thumbnails a").click(function() {
    var urlHref = $(this).attr('href');
    $("#work").html($("<img>").attr("src", urlHref));
    return false;
});
```
- Non, ce n'est pas un problème. Le this valeur aurait une autre valeur que si elle était à l'intérieur d'une fonction imbriquée expression / déclaration. Mais il n'est pas.
- J'ai essayé en utilisant ce code exact, même problème. Voici la page:
InformationsquelleAutor Yoram de Langen
0

Utiliser la propriété css background:url(...) au lieu de <img> tag lors de l'ajout d'images à l'aide de javascript dans Safari Mobile. Il ne fonctionnera pas avec <img> balises.
- Où veut-il dire que c'est en cours d'exécution sur un mobile?
- Pouvez-Vous l'expliquer, s'il vous plaît?
InformationsquelleAutor Jimmy Boyd

Vous devez vous connecter pour publier un commentaire.