Kirjautuminen
Tehtävät
Kilpailu
4. kierros:
7.11. klo 18 – 9.11. klo 23
Tällä tavalla pystyy lisäämään tekstiä textarean loppuun, mutta tietäiskö joku miten tekstin sais siihen kohtaan, jossa kursori on.
<html>
<body>
<form method="post" name="formi">
<script type="text/javascript">
function insertext(text){
document.formi.teksti.focus();
document.formi.teksti.value+=" "+ text;
document.formi.teksti.focus();
}
</script>
<textarea cols="40" rows="6" name="teksti"></textarea>
<a href="javascript:insertext('Teksti')">Lisää teksti</a>
</form>
</body>
</html>Vai onnistuisko vaikka php:llä
Eipä voi tehdä php:ä, koska php ei tiedä missä kursori on. Voisi tuon tietty tehdä onFocus() funktiolla, mutta se tekisi lisäyksen aina, kun hiirellä tökkää inputtia. Merri luultavasti keksii ongelmaan säällisen ratkaisun.
Nettihaulla löytyi koodia, jonka väitetään kertovan, missä kohdassa kursori (tässä yhteydessä caret) on.
http://blog.vishalon.net/Post/57.aspx
Tuota saattaa pystyä soveltamaan. Uuden tekstin voi lisätä funktion kertomaan paikkaan textarean value-kenttään. (En nyt kerkeä itse testata, mistä pahoitteluni.)
On tuolla tosiaan neuvottu miten kursorin paikan saa selville, mutta se ei näyttäisi ratkaisevan itse ongelmaa, koska
document.formi.teksti.value+=" "+ text
lisää tekstin jokatapauksessa loppuun. Ilmeisesti pitäisi osata jakaa valuen vanha teksti kahteen kursorin kohdalta, mutta taitaa olla ainakin mulle liian hapokasta.
string.slice on mahdollinen ratkaisu.
<html> <body> <script type="text/javascript"> var str ="Ohjputka"; var ins ="elmointi"; var beg = str.slice(0, 3); var end = str.slice(3); document.write(beg + ins + end); </script> </body> </html>
slice-funktiota voi kutsua kahdella eri tavalla. Alku otetaan nollasta siihen indeksiin kahdella argumetnilla ja loppu taas saadaan yhdellä argumentilla siitä indeksistä. Kokeile eri arvoja, niin toiminta selviää helposti.
Jos joku tietää luontevamman tavan, kertokaa ihmeessä. Just nyt ei ole paras aika JavaScriptailla...
Heippa hauki!
tässä sulle viritys...
<html><head><title>test</title>
<script>
var alku; var loppu;
function funktio(){
var alku = ""; var loppu = "";
//Alt + 255
if (document.all('txtArea').value.indexOf(' ') == -1
&& document.all('txtArea').value.length > 0) {
str=(typeof(str)=='string')?str: ' '; // välilyönti
sel = document.selection.createRange();
sel.text = ' '; //Alt + 255
loppu = document.all('txtArea').value.substring(document.all('txtArea').value.indexOf(' '));
alku = document.all('txtArea').value.replace(loppu, "");
//Alt + 255
loppu = loppu.replace(" ", "");
document.all('txtArea').value = alku +
document.all('txt').value + loppu;
}
}
</script></head><body>
<input type="text" id="txt"/><br>
<textarea id="txtArea" onclick="funktio()">
</textarea></body></html>Ehdin jo Kopeekkan avulla rueta väsäämään tällästä ja vaikuttas toimivan
<html>
<body>
<form method="post" name="formi">
<script type="text/javascript">
function insertext(text){
var alkuteksti=document.formi.teksti.value;
var alku=alkuteksti.slice(0, (etsikursori('teksti')));
var loppu=alkuteksti.slice(etsikursori('teksti'));
document.formi.teksti.focus();
document.formi.teksti.value=alku + text + loppu;
}
function etsikursori (ctrl) {
var paikka = 0;
// IE Support
if (document.selection) {
document.formi.teksti.focus ();
var Sel = document.selection.createRange ();
Sel.moveStart ('character', -document.formi.teksti.value.length);
paikka = Sel.text.length;
}
// Firefox support
else if (document.formi.teksti.selectionStart || document.formi.teksti.selectionStart == '0')
paikka = document.formi.teksti.selectionStart;
return (paikka);
}
</script>
<textarea cols="40" rows="6" name="teksti"></textarea>
<a href="javascript:insertext('Teksti')">Lisää teksti</a>
</form>
</body>
</html>Tällä aion tehdä pikanäppäimiä esim. hyperlinkin lisäykseen. Kiitti molemmille avusta, tutkin myös ton Nean vinkin.
Aihe on jo aika vanha, joten et voi enää vastata siihen.