Вопрос по forms, javascript – Форма действия с JavaScript

22

У меня есть форма, которая должна выполнить функцию javascript при отправке, функция затем отправляет данные в мой файл php send mail и почта отправляется. Но это работает только в огне лиса. Действие формы, похоже, ничего не делает в IE, мой вопрос: правильный ли это способ вызова функции из внешнего файла из действия формы:

<code>action="javascript:simpleCart.checkout()"
</code>

simpleCart - это файл .js, а checkout () - это функция.

Советы приветствуются, изо всех сил пытаясь понять, почему это будет работать в Firefox, но не в IE, Chrome или Safari.

<code><form name=form onsubmit="return validateFormOnSubmit(this)" enctype="multipart/form-data" action="javascript:simpleCart.checkout()" method="post">
</code>
Вы не можете вызвать эту функцию из validateFormOnSubmit? Joe
Я понимаю, что вы говорите. Разве не правильно использовать действие так, как я? whispering_Jack
я уже использую jquery, можете ли вы указать мне правильное направление? whispering_Jack
Нет, потому что simpleCart - это огромный js-файл для моей корзины, а validateFormOnSubmit - из моего валидационного файла .js, и я не могу объединить эти файлы. whispering_Jack

Ваш Ответ

3   ответа
25

Absolutely valid.

<form action="javascript:alert('Hello there, I am being submitted');">
    <button type=submit>
        Let's do it
    </button>
</form>
<!-- Tested in Firefox, Chrome, Edge and Safari -->

Итак, для краткого ответа:yesэто вариант, и хороший. Это говорит"when submitted, please don't go anywhere, just run this script" - довольно точно.

BUT

При попытке сделать это возникает небольшое неудобство:

<form action="javascript:myFunction(this)">  <!-- won't give you the sender -->

Это не то, что вы ожидаете;this должен дать вам объект отправителя, но это не так. Поэтому я предлагаю следующий формат, он содержит всего несколько символов и работает как шарм:

Recommended way

<form action="javascript:;" onsubmit="myFunction(this)">  <!-- now you have it! -->

... теперь вы можете получить доступ к форме отправителя. (Вы можете написать простое «#» как действие, это довольно распространенное явление - но у него есть побочный эффект прокрутки вверх при отправке.)

Опять же, мне нравится этот подход, потому что он легкий и самоочевидный. Нет & quot; возвратить false & quot ;, нет jQuery / domReady, нет тяжелого оружия. Он просто делает то, что кажется. Конечно, другие методы тоже работают, но для меня это Путь Самурая.

A note on validation

Если вам просто нужна проверка и перейдите на другую страницуif and only if форма была правильно заполнена, ну, это самая простая вещь:

<form action="/something.php" onsubmit="return myFunction(this)">

Теперь ваша функция будет работатьbefore представление происходит; и если он возвращает истину (-ish),/something.php получу ваши вещи. Ложные значения будут держать браузер на странице, и вы можете начать кричать на пользователя за неправильный ввод.

Error: User Rate Limit Exceeded
1

Я всегда включаю js-файлы в заголовок html-документа, а они в действии просто вызывают функцию javascript. Что-то вроде этого:

action="javascript:checkout()"

Ты попробуешь это?

Не забудьте включить ссылку на скрипт в заголовок HTML.

Я не знаю причину того, что работает в Firefox. С уважением.

Error: User Rate Limit Exceeded whispering_Jack
Error: User Rate Limit Exceeded whispering_Jack
Error: User Rate Limit Exceededjsfiddle.net/Ntwg9
Error: User Rate Limit Exceededapi.jquery.com/submitError: User Rate Limit Exceededqueness.com/post/160/…Error: User Rate Limit Exceeded
41

установленное для функции JavaScript, широко не поддерживается, я удивлен, что оно работает в FireFox.

Лучше всего просто установить формуaction в ваш PHP-скрипт; если вам нужно что-то сделать перед отправкой, вы можете просто добавить вonsubmit

Edit оказалось, что вам не нужны никакие дополнительные функции, просто небольшое изменение здесь:

function validateFormOnSubmit(theForm) {
    var reason = "";
    reason += validateName(theForm.name);
    reason += validatePhone(theForm.phone);
    reason += validateEmail(theForm.emaile);

    if (reason != "") {
        alert("Some fields need correction:\n" + reason);
    } else {
        simpleCart.checkout();
    }
    return false;
}

Тогда в вашей форме:

<form action="#" onsubmit="return validateFormOnSubmit(this);">
Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded whispering_Jack
Error: User Rate Limit Exceeded
Error: User Rate Limit Exceeded<script type=text/javascript> function validateAndSubmit(form) { if (validateFormOnSubmit(form)) { simpleCart.checkout(); } return false; } </script>Error: User Rate Limit Exceeded whispering_Jack
Error: User Rate Limit Exceeded whispering_Jack

Похожие вопросы