jQuery « Изменение ссылки(добавление значения из input), при помощи jquery
Нужно при помощи jquery в конец ссылки добавлять значение, введенное в инпуте.
Я сделал таким образом:
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .html4strict.geshi_code {font-family:monospace;} .html4strict.geshi_code .imp {font-weight: bold; color: red;} .html4strict.geshi_code .kw2 {color: #000000; font-weight: bold;} .html4strict.geshi_code .kw3 {color: #000066;} .html4strict.geshi_code .es0 {color: #000099; font-weight: bold;} .html4strict.geshi_code .br0 {color: #66cc66;} .html4strict.geshi_code .sy0 {color: #66cc66;} .html4strict.geshi_code .st0 {color: #ff0000;} .html4strict.geshi_code .nu0 {color: #cc66cc;} .html4strict.geshi_code .sc-1 {color: #808080; font-style: italic;} .html4strict.geshi_code .sc0 {color: #00bbdd;} .html4strict.geshi_code .sc1 {color: #ddbb00;} .html4strict.geshi_code .sc2 {color: #009900;} .html4strict.geshi_code span.xtra { display:block; }
<input name="vvod" type="text" id="vvod" size="10" value="">
<a href="#" class="update">1111</a>
<a href="/yandex.ru/" class="test">yandex.ru</a> <!-- ссылка, которую нужно изменить -->
<script type="text/javascript">
$('.update').click(function(){
$('.test').attr('href',$('a.test').attr('href') + '?amount=' + $('#vvod').val());
return false;
});
</script>
-----------------------------------
Ну это только по клику происходит, конечно ссылка обновляется, но если несколько раз нажать на ссылку с функцией,то получается след.:
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .html4strict.geshi_code {font-family:monospace;} .html4strict.geshi_code .imp {font-weight: bold; color: red;} .html4strict.geshi_code .kw2 {color: #000000; font-weight: bold;} .html4strict.geshi_code .kw3 {color: #000066;} .html4strict.geshi_code .es0 {color: #000099; font-weight: bold;} .html4strict.geshi_code .br0 {color: #66cc66;} .html4strict.geshi_code .sy0 {color: #66cc66;} .html4strict.geshi_code .st0 {color: #ff0000;} .html4strict.geshi_code .nu0 {color: #cc66cc;} .html4strict.geshi_code .sc-1 {color: #808080; font-style: italic;} .html4strict.geshi_code .sc0 {color: #00bbdd;} .html4strict.geshi_code .sc1 {color: #ddbb00;} .html4strict.geshi_code .sc2 {color: #009900;} .html4strict.geshi_code span.xtra { display:block; }
<a href="/yandex.ru/?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111" class="test">yandex.ru</a>
Как сделать, чтобы не по клику это все происходило и именно обновлялось значение, а не добалялось
Я сделал таким образом:
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .html4strict.geshi_code {font-family:monospace;} .html4strict.geshi_code .imp {font-weight: bold; color: red;} .html4strict.geshi_code .kw2 {color: #000000; font-weight: bold;} .html4strict.geshi_code .kw3 {color: #000066;} .html4strict.geshi_code .es0 {color: #000099; font-weight: bold;} .html4strict.geshi_code .br0 {color: #66cc66;} .html4strict.geshi_code .sy0 {color: #66cc66;} .html4strict.geshi_code .st0 {color: #ff0000;} .html4strict.geshi_code .nu0 {color: #cc66cc;} .html4strict.geshi_code .sc-1 {color: #808080; font-style: italic;} .html4strict.geshi_code .sc0 {color: #00bbdd;} .html4strict.geshi_code .sc1 {color: #ddbb00;} .html4strict.geshi_code .sc2 {color: #009900;} .html4strict.geshi_code span.xtra { display:block; }
<input name="vvod" type="text" id="vvod" size="10" value="">
<a href="#" class="update">1111</a>
<a href="/yandex.ru/" class="test">yandex.ru</a> <!-- ссылка, которую нужно изменить -->
<script type="text/javascript">
$('.update').click(function(){
$('.test').attr('href',$('a.test').attr('href') + '?amount=' + $('#vvod').val());
return false;
});
</script>
-----------------------------------
Ну это только по клику происходит, конечно ссылка обновляется, но если несколько раз нажать на ссылку с функцией,то получается след.:
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .html4strict.geshi_code {font-family:monospace;} .html4strict.geshi_code .imp {font-weight: bold; color: red;} .html4strict.geshi_code .kw2 {color: #000000; font-weight: bold;} .html4strict.geshi_code .kw3 {color: #000066;} .html4strict.geshi_code .es0 {color: #000099; font-weight: bold;} .html4strict.geshi_code .br0 {color: #66cc66;} .html4strict.geshi_code .sy0 {color: #66cc66;} .html4strict.geshi_code .st0 {color: #ff0000;} .html4strict.geshi_code .nu0 {color: #cc66cc;} .html4strict.geshi_code .sc-1 {color: #808080; font-style: italic;} .html4strict.geshi_code .sc0 {color: #00bbdd;} .html4strict.geshi_code .sc1 {color: #ddbb00;} .html4strict.geshi_code .sc2 {color: #009900;} .html4strict.geshi_code span.xtra { display:block; }
<a href="/yandex.ru/?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111?amount=111" class="test">yandex.ru</a>
Как сделать, чтобы не по клику это все происходило и именно обновлялось значение, а не добалялось
1 ответов
Немного упростил. Теперь кликать не нужно.
HTML:
<input name="vvod" type="text" id="vvod" size="10" value="">
<a href="/yandex.ru/" class="test" id="link">yandex.ru</a>
JS:
$("#vvod").keyup(function() {
$("#link").attr("href", "/yandex.ru/?amount="+$("#vvod").val());
});
HTML:
<input name="vvod" type="text" id="vvod" size="10" value="">
<a href="/yandex.ru/" class="test" id="link">yandex.ru</a>
JS:
$("#vvod").keyup(function() {
$("#link").attr("href", "/yandex.ru/?amount="+$("#vvod").val());
});