étiquette Sélectionnez l'intérieur problème de lien hypertexte

J'ai simplifié ma page et voici ce que j'ai:étiquette Sélectionnez l'intérieur problème de lien hypertexte

<html> 
<head> 
<meta http-equiv="content-type" content="text/plain; charset=utf-8" /> 
<title>Title</title> 
<style> 
    a { 
     text-decoration: none; 
    } 

    div select { 
     margin-top: 20px; 
     display: block; 
    } 
</style> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script> 
    $('div').click(function(){ 
         return false; 
         }); 
</script> 


</head> 

<body> 
<a href="#############"> 
<img src="preview_image" /> 
    <div> 
     <input type="text" value="" /> 
     <select> 
      <option value="default" selected>choose</option> 
      <option value="1">1</option> 
      <option value="2">2</option> 
      <option value="3">3</option> 
     </select> 
    </div> 
</a> 
</body> 
</html>

L'idée principale est que j'ai une balise de lien hypertexte « A », à l'intérieur duquel est inclus DIV avec INPUT et SELECT intérieur .

Quel est mon but: lorsque je mets du texte dans INPUT et que je sélectionne l'option de SELECT - le lien hypertexte parent A ne devrait pas se déclencher.

J'ai essayé de le réparer avec "return false", mais cela n'aide pas.

J'ai aussi un problème avec Mozilla FF: SELECT ne choisit aucune valeur que vous choisissiez dans la liste. Il est toujours laissé comme "choisir"

UPD

le seul problème qui reste est le comportement SELECT à l'intérieur A-lien hypertexte dans FireFox. J'ai FF version 3.6.3 Et le comportement est quand je choisis l'option de SELECT il n'est pas défini comme choisi. Dans tous les navigateurs de repos semblent fonctionner correctement.

Source

2010-06-20 Volder

Pourquoi avez-vous besoin d'avoir le '' en premier lieu? Il n'est pas valide d'avoir un 'div' et cela pourrait causer des problèmes. –

Ouais, quel est le but de l'A-tag? Qu'essayez-vous d'accomplir? –

oui, je sais que l'élément de bloc n'est pas correct à mettre à l'intérieur. C'est ce que j'ai comme "héritage". Si c'est le cas, toute la fonctionnalité devrait être réécrite, ce que je veux éviter. Mais il semble que le problème que j'ai décrit n'est pas à cause de cela. Cela se produit même si j'oublie DIV du balisage. L'idée principale: il y a des photos sur le site. Et en survol - il y a un bouton (DIV) affiché sur l'image. Au clic, INPUT et SELECT sont ajoutés à ce bouton pour d'autres actions. Mais parfois des images sont incluses dans une étiquette (par exemple un aperçu), et il y a des problèmes que j'ai décrits. – Volder

Le problème avec votre approche: tout est contenu dans cet élément de lien. Donc, en théorie, un navigateur a raison de supposer que tout ce qui est cliqué à l'intérieur de cette A-tag est en cliquant sur le lien. Même si cela peut fonctionner différemment pour certains navigateurs, et conduire au comportement que vous souhaitez, je doute que le comportement soit cohérent sur tous les agents utilisateurs. Par conséquent, je ne vois pas comment il est possible de faire ce travail de manière fiable sans se débarrasser de l'élément A, déplaçant l'élément A de façon à ce qu'il ne contourne que l'image (comportement que vous désirez):

<a href="#############"> 
    <img src="preview_image" /> 
</a> 
<div> 
    <input type="text" value="" /> 
    <select> 
      <option value="default" selected>choose</option> 
      <option value="1">1</option> 
      <option value="2">2</option> 
      <option value="3">3</option> 
    </select> 
</div>

Source

2010-06-20 09:22:37

le problème est que ce DIV est ajouté par JS au chargement de la page. Et il est ajouté à chaque image. Les images sont parfois enveloppées de A et parfois ne le sont pas. Donc, à des fins générales, le DIV a été ajouté après chaque image, à cause de cela, il est parfois à l'intérieur de A-tag et parfois non. En fait, la réponse dans le post précédent est l'arrêt de la suite A-tag. Mais il y a un autre problème dans FireFox, où il y a un problème avec le choix de la valeur dans l'élément SELECT dans A-tag. Ce n'est tout simplement pas choisi. Si vous avez un conseil à ce sujet - j'apprécierais. Tnx. – Volder

Ne pouvez-vous pas changer le script pour ajouter la div après l'a-tag qui l'entoure au lieu de directement après l'immage? –

Comme je l'ai dit, je ne vois pas comment cela fonctionnera correctement dans tous les navigateurs actuels (et futurs). Comme Chris_I l'a écrit: commencez à le redessiner maintenant, il devra être repensé finalement de toute façon. –

Même si je ne sais pas, ce que vous avez besoin de votre entière <a><div>... construction pour, en tout cas, vous devez mettre votre script dans un bloc prêt(), de sorte qu'il exécute lorsque la page est chargée:

$(document).ready(function(){ 

    $('div').click(function(){ 
     return false; 
    }); 

});

Source

2010-06-20 09:12:50

merci. Mais dans le firefox, alors que le lien A est arrêté, la valeur de la liste SELECT n'est pas choisie. J'ai écrit à ce sujet dans l'initiale. Il est toujours laissé comme "choisir". – Volder

@volder: Cela ne fonctionnera pas. Ce n'est tout simplement pas conçu pour fonctionner. Changer la structure, à la fin de la journée, cela vous fera économiser beaucoup de temps et de maux de tête. –

ok, merci pour le conseil – Volder

étiquette Sélectionnez l'intérieur problème de lien hypertexte

Répondre

Questions connexes