Простая форма Отправить код - PullRequest
1 голос
/ 11 декабря 2010

Я хочу создать простую форму, содержащую только текстовое поле ввода и кнопку поиска.

Человек вводит в поле поиска термин и нажимает поиск.

Все, что нужно будет сделать, - это взять поисковый запрос и добавить его в конец URL.

Таким образом, если поисковый термин "хорошая итальянская еда", кнопка "Отправить" отправит пользователя на http://domain/find/good итальянская еда

Какой самый простой способ сделать это?

Спасибо!

Ответы [ 4 ]

3 голосов
/ 11 декабря 2010
<html>
  <head>
    <script type='text/javascript'> 
      function Search() {
        var keyword = document.getElementById("keyword").value; 
        var url = "http://yourwebsite.com/find/"+keyword; 
        window.location = url; 
        return false;
      }
    </script>
  </head>
  <body>
    <form name="search">
      <input type="text" name="keyword" id="keyword" />
      <input type="button" name="btnser" onclick="Search()" value="Search" />
    </form>
  </body>
</html>
0 голосов
/ 11 декабря 2010

вы можете переопределить атрибут действия в событии onsubmit: Пример

HTML

<form action="#" onsubmit="send(this)" method="post" target="_blank" >
    <input id="text"/>
    <input type="submit" value="submit"/>
</form>

JavaScript

function send( form){
    form.action = location.href + '/'+encodeURI(document.getElementById('text').value);
}

Кроме того, переопределение действия формы или перенаправление пользователя в событии onsubmit позволит вам использовать настоящую кнопку submit.

Это дает пользователю возможность просто нажать enter key как только они закончат набирать текст, чтобы отправить поиск, вам не придется писать дополнительную логику, слушая нажатие клавиши ввода в текстовом поле для отправки поиска.

0 голосов
/ 11 декабря 2010

Я бы также предложил использовать encodeURI (), чтобы сделать его «безопасным».

http://www.w3schools.com/jsref/jsref_encodeuri.asp

0 голосов
/ 11 декабря 2010

используйте javascript и html форму

создать форму с кнопкой и текстовым полем в сообщении формы вызовите функцию javascript, чтобы создать URL с пользовательским текстом ввода

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'>
  function redirect(){  
    var s = document.getElementbyID("txt").value;
    var url="http://url.com/" + s;
    window.location = url;
  }
</script>
</head>
<body>
  <form>
    <input type=''></input>
  </form>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...