Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá pessoal
Gostaria de saber se é possível fazer um intellisense em ou Textarea ou em um Rich Text com javascript.
Tentei ver se conseguia pegar as coordenadas do cursor de digitação dentro de um Textarea e Rich Text para abrir uma div com as opções mas não consegui.
Pra que não sabe o que é intellisense segue uma imagem do mesmo (intellisense é aquela janelinha que tem as propriedades do objeto)
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.litwindow.com/Products/wxVisualSetup/intellisense.JPG&key=a8efcfce056da21c9c75ffad7d8760526453d76c74823dc49f7cf6b20b2dcf24" alt="Imagem Postada" />
Valeu
Obrigada Andreia... mas até ai já tinha chego...
O problema mesmo é pegar a posição do cursor de digitação para colocar as opções após este cursor... mas pelo que vi só consigo pegar a posição de um objeto não de um cursor de digitação...
tens alguma idéia de como fazer isso?
valeu
Tem como sim, e um exemplo funcional é o próprio fórum aqui. Quando você está digitando um post e aí clica em qualquer lugar do texto e insere um emoticon ele aparece no local.
Sim, aqui no fórum ele pega o selStart, porém o que preciso é não é linha e coluna e sim as coordenadas do cursor
valeu
Ah!!! Entendi! :)
Tenta isso aqui então:
<script language="JavaScript" type="text/javascript">
<!--
function coordenadas(ev) {
var e = (window.event)?window.event:ev;
var x = e.clientX;
var y = e.clientY;
var localizacao = (x + " »« " + y);
document.getElementById('coordenadas').innerHTML = localizacao;
}<body.... onMouseMove="coordenadas(event);"...>
E depois a tag pra aparecer as coordenadas:
<span id="coordenadas"></span>
ABRAX!!
Valeu berkowitz pela ajuda, mas não é a posição do mouse que eu quero, eu quero as coordenadas o ponteiro do cursor de digitação em um rich text por exemplo. Ai vai um print screen do fckeditor pra ficar mais claro
/applications/core/interface/imageproxy/imageproxy.php?img=http://www.geocities.com/blukinho/cursor.gif&key=86e18500a7ea2ca65c6d872d39c60928332efbec0ca7ec28c19aa9cc5ec28d2d" alt="Imagem Postada" />
valeu!!!
Mas então, como eu disse! Da forma como é aqui no fórum não da pra ajudar? C pegar o selStart e jogar a provável div pra aparecer alí?
Bom, pelo que sei, com o selStart eu pego apenas a posição na linha em que o cursor está, assim vou apenas conseguir jogar caracteres dentro da caixa de texto na posição correta, mas o que preciso é que uma div se posicione logo após o cursor de edição de texto, independentemente onde esteja a caixa de texto e independentemente da rolagem dela.
Por exemplo, digamos que tenha um texto de 9 linhas, mas apenas 5 fiquem visiveis. Se meu cursor estiver na linha cinco, ele aparecerá na última linha visivel, mas se eu rolar o scroll ele ficará na primeira.
Por isso preciso das coordenada X e Y do cursor, pra jogar a div logo depois dele independentemente de barra de rolagem resolução da tela ou qualquer outro fator.
valeu
Hmmm.... entendi.
Mas vamos ver se minha idéia está correta heehehe:
O selStart retorna um valor numérico de onde o cursor está, correto? Se você pegar esse valor e utilizar para posicionar sua caixa (DIV por exemplo) não da certo?
Exatamente, o selectionStart conta o número de caracteres, segue um exemplo
<script language="JavaScript" type="text/JavaScript">
function informaposicao() {
var posicao = document.formulario.texto.selectionStart;
alert(posicao);
}
</script>
<form name="formulario">
<center>
<input name="botao" type="button" value="Ver posição" onClick="informaposicao();">
<br>
<br><br><br>
<textarea name="texto" id="texto" cols="30" rows="10"></textarea><br>
</center>
</form>Só que este número, o do selStart não me traz a realidade das coordenadas, pq ele cria uma barra horizontal que faz com que o meu cursor que pode estar no último caracter visivel, vir a estar no primeiro caracter visivel se eu rolar a barra... e pra mim é necessário que a barra exista...
Há inúmeros outros problemas se eu tentar achar as coordenadas do cursor pelo selStart... outro exemplo é se o usuário quiser utilizar uma fonte que não é fixa, ou seja uma letra pode ter o tamanho diferente da outra, assim mesmo se eu tentar calcular a posição do cursor não vai funcionar....
Precisava mesmo de uma função se pegasse com precisão as coordenados do cursor de digitação
valeu
Ta certo... entendi.
Bom... resumindo: Lascou! ahuaHhahuA
Sei que esse tópico é antigo mas estou procurando sobre o assunto e achei esse link..
http://stackoverflow.com/questions/128342/display-div-at-cursor-position-in-textarea
já é um começo, abraços...
Tenho este script que peguei da net uma vez, veja se te ajuda:
<!-- var nameArray=new Array( "Adam Young", "Albert Downey", "Bernie Pottrell", "Beth Wood", "Cathy Tillyer", "Denis O'Rourke", "George Palframan", "Holly Toogood", "Ian Thompson", "James Skinner", "Jenny Hackwell", "John O'Neill", "Kathy Toogood", "Lizzie Schofield", "Malcolm Toogood", "Mike Child", "Mike Pollard", "Paul Whitrow", "Pete Escott", "Richard Gilbert", "Richard Wheeler", "Russell Kay", "Shelley Godwin", "Simon Givens", "Steve White", "Tim Smith", "Tom Bagshaw", "Tony Dannatt" ) "yellowgreen" ) 'WindowText' )document.write(
hld.id='listHolder' document.body.appendChild(hld) } hld.style.top=(T+obj.offsetHeight) hld.style.left=L hld.style.display='none' if(txt.toLowerCase()==what[a].toLowerCase().substring(0,txt.length)){ match=true hld.innerHTML=str hld.style.display='block' sel.focus() } if(k=='13'){ document.getElementById('listHolder').style.display='none' //boxAction(obj.value) } } } } obj.value=val obj.focus() document.getElementById('listHolder').style.display='none' } while(obj.offsetParent){ curleft+=obj.offsetLeft while(obj.offsetParent){ curtop+=obj.offsetTop alert(val) }'<style type="text/css">'+
'#listHolder{'+
' position:absolute;'+
' border:0;'+
'}'+
'.list{'+
' font-family:verdana;'+
' font-size:10;'+
' color:#000000;'+
' background:;'+
'}'+
'<\/style>'
)
//-->