2013-12-16 4 views
2

Мне нужно связать три входных значения со ссылкой. Как я могу сделать это легко, и я нажимаю ссылку, которую я хочу открыть URL.Я хочу вставить входные значения в ссылку

<html> 
    <script type="text/javascript"> 
     function changeText2(){ 
     var userInput0 = document.getElementById('userInput').value; 
     var userInput11 = document.getElementById('userInput').value; 
     var userInput21 = document.getElementById('userInput2').value; 
     document.write("userinput"); 
    } 
    </script> 

    Here is a link : <a href="/00ON0000000FOHS?pc0=userInput0&pn0=userInput11&pv0=userInput21" >nothing here yet</a> <br/> 
    <input type='text' id='userInput' value='Enter Search String Here' /> 
    <input type='text' id='userInput1' value='Enter Text Here' /> 
    <input type='text' id='userInput2' value='Enter Text Here' /> 
    <input type='button' onclick='changeText2()' value='Change Link'/> 
</html> 
+1

Ваш вопрос непонятен. –

+0

Вы хотите сделать новую ссылку? или просто нужно создать параметры для строки запроса из входов? Кажется, что вы хотите добавить параметры! –

+0

Используйте тег формы и установите для этого значения href значение. и метод как Get, а в гиперссылке установить href как # и щелкнуть форму вызова гиперссылки. Отправить() – Priyank

ответ

3

Если Ваша ссылка статична, чем вы можете создать свой HREF ссылку в сценарии это сам, как:

var link = document.getElementById("test"); 
link.href = "/00ON0000000FOHS?pc0="+userInput0+"pn0="+userInput11+"pv0="+userInput21; 

Здесь test является идентификатором вашего <a> элемента.
Вы можете привязать ссылку href, добавив значение параметра.

+0

нет, он динамический, он изменится в соответствии с данными пользователя – tejdeep

+0

Я имею в виду, что ваш url part '/ 00ON0000000FOHS' статичен или нет? Я не спрашиваю о том, что ваша часть данных вводится пользователем. –

+0

ya id is static – tejdeep

1

Изменить функцию:

function changeText2(){ 
     var userInput0 = document.getElementById('userInput').value; 
     var userInput11 = document.getElementById('userInput1').value; 
     var userInput21 = document.getElementById('userInput2').value; 
     //document.write("userinput"); 
     window.open("/00ON0000000FOHS?pc0="+userInput0+"&pn0="+userInput11+"&pv0="+userInput21, "_self"); 
} 

Если вы хотите, чтобы открыть в новом окне, используйте «_blank» во 2-й аргумент window.open.

После прочтения ответа STO (это неточно) я понимаю, вам на самом деле не нужно использовать js для этого. Для этого была создана стандартная форма html. Используйте только это, не требуется никаких ЯШ:

<form method='GET' action='/00ON0000000FOHS'> 
    <input type='text' id='userInput' name='pc0' value='Enter Search String Here' /> 
    <input type='text' id='userInput1' name='pn0' value='Enter Text Here' /> 
    <input type='text' id='userInput2' name='pv0' value='Enter Text Here' /> 
    <input type='submit' value='Change Link'/> 
</form> 

Название часть входного тега будет использоваться в качестве ключа аргумента, а значение, введенное в поле ввода является значение в запросе GET.

+0

три поля ввода в одном URL-адресе, о котором я упоминал выше, – tejdeep

+0

ответ отредактирован соответствующим образом. – DetourToNirvana

+0

Спасибо за ваш ценный ответ. Было бы лучше, как я могу сохранить это в url – tejdeep

1

Самый стандартный на основе способ является использованием формы с помощью метода GET

<form method='GET' action='/00ON0000000FOHS?'> 
    <input type='text' id='userInput' name='pc0' value='Enter Search String Here' /> 
    <input type='text' id='userInput1' name=pn0' value='Enter Text Here' /> 
    <input type='text' id='userInput2' name='pv0' value='Enter Text Here' /> 
    <input type='submit' value='Change Link'/> 
</form> 

Названия части входного тега будет использоваться в качестве ключа аргумента, и значением, введенного в поле ввода является значением в запрос получения.

+0

Мне нужны три входных данных в URL-адресе и нажмите кнопку отправки, чтобы открыть этот URL-адрес – tejdeep

2

Я написал jsFiddle с рабочим раствором:

http://jsfiddle.net/t8kAS/

Обратите внимание, что я удалил кнопку и поставить событие на OnChange событие.

$(".jsCustomField").on("change", function() { 
    var customLink = linkTemplate.replace("{0}", $input1.val()) 
            .replace("{1}", $input2.val()) 
            .replace("{2}", $input3.val()); 
    $dynLink.attr("href", customLink); 
}); 

Надеюсь, это поможет!

Смежные вопросы