Можно ли сделать так, чтобы не отправляла форму?

У меня есть форма с 2 кнопками.

<a href="index.html"><button>Cancel changes</button></a>

<button type="submit">Submit</button>

Я использую jQuery UI's button и на них, просто вот так

$('button').button();

Однако первая кнопка также отправляет форму. Я бы подумал, что если у нее нет `type="submit", то она и не отправляет.

Очевидно, я могу сделать следующее

$('button[type!=submit]').click(function(event) { event.stopPropagation(); });

Но есть ли способ запретить кнопке "Назад" отправлять форму без вмешательства JavaScript?

Честно говоря, я использовал кнопку только для того, чтобы я мог стилизовать ее с помощью jQuery UI. Я попробовал вызвать button() на ссылке, но это не сработало так, как ожидалось (выглядело довольно уродливо!).

alex
Редактировал вопрос 25-го июня 2012 в 11:29
Программирование
javascript button html jquery jquery-ui
23-го июля 2010 в 2:29
25 просмотров
Комментарии к вопросу (2)
Решение

Значение по умолчанию для атрибута type элементов button это "submit". Установите его в type="button" для создания кнопки, которая не отправляет форму.

Submit

Говоря словами HTML Standard: "Ничего не делает"

leonheess
Редактировал ответ 15-го июля 2019 в 8:16
Комментарии (5)

Элемент button имеет тип по умолчанию submit.

Вы можете заставить его ничего не делать, установив тип button:

Cancel changes
alex
Редактировал ответ 30-го мая 2014 в 5:13
Комментарии (2)

Просто используйте старый добрый HTML:

<input type="button" value="Submit" />

При желании оберните его в тему ссылки:

<a href="http://somewhere.com"><input type="button" value="Submit" /></a>

Или если вы решите, что хотите, чтобы javascript обеспечил какую-то другую функциональность:

<input type="button" value="Cancel" onclick="javascript: someFunctionThatCouldIncludeRedirect();"/>
Jeffrey Blake
Редактировал ответ 23-го июля 2010 в 5:31
Комментарии (12)

Честно говоря, я, как и другие ответы. Легко и вам не нужно погружаться в JS. Но я заметил, что вы спрашивали о jQuery. Поэтому для полноты картины, в jQuery, если вы возвратите false с .нажмите кнопку() обработчик, он отменяет действие по умолчанию виджет.

См., например, здесь (и еще больше вкусностей,). Здесь'ы в документации тоже.

в двух словах, с вашего примера кода, сделайте следующее:

<script type="text/javascript">
    $('button[type!=submit]').click(function(){
        // code to cancel changes
        return false;
    });
</script>

<a href="index.html">Cancel changes</a>
Submit

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

alex
Редактировал ответ 4-го февраля 2016 в 8:42
Комментарии (1)

Не устанавливая атрибут "тип", вы также можете вернуть false от функция onclick обработчик, и объявить атрибут onclick как функция onclick="и вернуть onBtnClick(событие) и".

Harun Diluka Heshan
Редактировал ответ 19-го марта 2018 в 2:18
Комментарии (0)

Да, можно сделать, чтобы кнопка не представить форму добавления атрибута типа кнопки значение: &л;тип кнопки="и кнопка" и><кнопка>

Комментарии (0)

        <div class="control-group">

            <input type="text" name="subject_code" id="inputEmail" placeholder="Subject Code">
        </div>
        <div class="control-group">
            <input type="text" class="span8" name="title" id="inputPassword" placeholder="Subject Title" required>
        </div>
        <div class="control-group">
            <input type="text" class="span1" name="unit" id="inputPassword" required>
        </div>
            <div class="control-group">
            Semester
            <div class="controls">
                <select name="semester">

                    1st
                    2nd
                 0){ ?>
        <script>
        alert('Data Sudah Ada');
        </script>
        <?php
        }else{
        mysql_query("insert into subject (subject_code,subject_title,description,unit,semester) values('$subject_code','$title','$description','$unit','$semester')")or die(mysql_error());

        mysql_query("insert into activity_log (date,username,action) values(NOW(),'$user_username','Add Subject $subject_code')")or die(mysql_error());

        ?>
        <script>
        window.location = "subjects.php";
        </script>
        <?php
        }
        }

        ?>
Комментарии (0)