я могу использовать кнопку отправки, чтобы активировать функцию AJAX? - PullRequest
Новая
       0

я могу использовать кнопку отправки, чтобы активировать функцию AJAX?

1 голос
/ 11 января 2012

У меня есть HTML-форма, которая в настоящее время просто отправляет данные прямо в файл PHP.Я хочу обновить код, чтобы кнопка отправки отправляла данные в функцию JavaScript, чтобы я мог создать функцию AJAX.Возможно ли, чтобы кнопка отправки активировала функцию JavaScript вместо публикации в php-файле?Единственное, что я придумал, это ниже, что, очевидно, не работает: 

<html>
<head>
<script type="text/javascript">
function ajax(){
  //...
}
</script>
</head>

<body>
<form action="ajax();">
  <!-- ... -->
  <input type="submit" value="Submit" />
</form>
</body>
</html>

Ответы [ 4 ]

6 голосов
/ 11 января 2012

Вы можете задать для ввода "submit" обработчик "click", который явно препятствует выполнению поведения по умолчанию. 

<input type='submit' value='Submit' onclick='ajax(event)'>

Тогда в функции: 

function ajax(event) {
  if ('preventDefault' in event) event.preventDefault();
  event.returnValue = false; // for IE before IE9
  // ...
}

edit @Esailija правильно указывает, что другим вариантом является обработка события submit в элементе <form>. Функция выглядела бы примерно так же, фактически точно так же, но вы бы подключили ее так: 

<form id='yourForm' onsubmit='ajax(event)'>

Это также будет захватывать такие вещи, как действие клавиши "Enter" и т. Д.

2 голосов
/ 11 января 2012

Конечно можно. Но более полезно вызывать вашу функцию Javascript при вводе так: 

 <input type="submit" value="Submit" onclick="ajax();" />

И удалить часть действия в форме.

0 голосов
/ 11 января 2012

Указание правильное ... просто добавьте обработчик кликов к кнопке отправки, однако убедитесь, что последняя строка обработчика кликов возвращает "false", чтобы предотвратить фактическую публикацию формы в действии формы. 

<html>
<head>
<script type="text/javascript">
function ajax(){
  //...
return false;
}
</script>
</head>

<body>
<form action="thispage.htm">
  <!-- ... -->
  <input type="submit" value="Submit" onclick="ajax();" />
</form>
</body>
</html>
0 голосов
/ 11 января 2012

Я jQuery вы можете использовать event.preventDefault(); в противном случае просто используйте return false;

http://jsfiddle.net/mKQmR/

http://jsfiddle.net/mKQmR/1/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...