2010-09-19 2 views
2

J'ai un div qui contient la valeur de la zone de texte sur le clavier, alors que je tape dans le textarea, il est montré dans le div, le div est un aperçu de commentaire pour le textarea. est-il possible d'émuler un clic dans la zone de texte quand je clique dans la div? donc si dans la div je clique sur le mot 'monde' dans la phrase 'Bonjour tout le monde je suis sur toi', alors ça émulerait le clic sur le même mot au même point dans la zone de texte?Jquery: un div qui contient la valeur d'un textarea, quand je clique sur un mot dans le div, faites-le cliquez là dans la zone de texte

est-il un moyen de faire cela avec jquery?

Répondre

0

« émule le clic sur le même mot au même point dans la zone de texte »

Je suppose que difficile à saisir la position exacte du texte textarea, mais vous pouvez faire quelque chose ci-dessous (si il ne répond pas à vos exigences). s'il te plaît essaye de comprendre. Je pense que c'est difficile parce que cliquer simplement sur du texte dans une balise <div /> ne donne pas la position de décalage du mot. Si vous allez sélectionner du texte dans div, peut-être cela post aide.

Mais je voudrais savoir s'il est possible en utilisant seulement un .click()

Si quelqu'un arrive avec une pensée fraîche, il serait plus utile =)

HTML:

<!DOCTYPE html> 
<html> 
<head> 
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<meta charset=utf-8 /> 
<title>Avinash</title> 

<style> 
    #input , #output { margin: 20px;width:300px;height:200px; border:1px solid #000; font 15px Arial; } 
    #output {overflow:scroll;float:left; font:bold 14px verdana; color : #0099b9; } 
</style> 
</head> 
<body> 
    <table> 
    <tr> 
     <td> 
     <textarea id="input" >Type your Text </textarea> 
     </td> 
     <td> 
     <div id="output" > </div> 
     </td> 
    </tr> 
    </table> 
    </span> 
</body> 
</html> 

JavaScript:

$(function() { 
     $('#input').one('focus',function() { 
      $(this).val(''); 
     }).bind('keyup',function() { 
     $('#output').text($(this).val()); 
     }); 

     $('#output').bind('click',function() { 
     alert('focusing Textarea'); 
     $('#input').focus(); 
     }); 
    }); 

vous pouvez tester le code ci-dessus: http://jsbin.com/atuqo4

+0

je suis en train de créer un éditeur de texte WYSIWYG extrêmement simple, avec seulement la possibilité d'ajouter en gras, en italique, des liens et des blocs de citation. Je pensais que ce serait la façon dont ils l'ont fait, car une zone de texte n'affiche pas les styles comme gras ou italique, ou si j'ai entendu. Savez-vous si c'est comme ça qu'ils le font ou ...? –

+0

vous voulez dire, vous voulez rendre la sortie dans la balise 'div' ou dans Textarea, Si vous visez votre sortie dans balise div, je crois que cela pourrait être fait, mais je ne suis pas sûr de textarea –

+0

rendre la sortie dans le div, je pensais, faire le div et le textarea exactement la même chose dans la taille de la police et tout, donc quand vous tapez dans le textarea, il s'aligne parfaitement avec la div. puis jquery envelopper chaque mot dans la div avec un afin que vous puissiez obtenir la position XY de ce mot, puis avoir chaque mot qui a une sorte de style de police, par exemple: italique, gras, etc ont ces mots saisis et superposés sur le textarea utilisant les coordonnées XY, le reste je suis sûr que je pourrais comprendre plus tard, mais qu'en pensez-vous? Donc, je ne ferais que positionner les mots stylisés/liens, pas le reste. Ouais? –

Questions connexes