Question

我有一个表格，有2个按钮

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

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

我也使用jQuery UI的按钮，就像这样

$('button').button();

但是，第一个按钮也会提交表单。我原以为如果它没有type="submit"，它就不会。

显然我可以做到这一点

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

但有没有办法可以阻止该后退按钮在没有JavaScript干预的情况下提交表单？

说实话，我只使用了一个按钮，所以我可以用jQuery UI设置它。我尝试在链接上调用button()，但它没有按预期工作（看起来很丑陋！）。

Answer 1

type attribute of button elements 的默认值为“submit”。将其设置为type=button以生成不提交表单的按钮。

<button type=button>Submit</button>

用HTML标准的话说：“什么都不做。”

Answer 2

The button element的默认类型为submit。

您可以通过设置button：

的类型使其无效

<button type="button">Cancel changes</button>

Answer 3

使用好的旧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();"/>

Answer 4

<form onsubmit="return false;">
   ...
</form>

Answer 5

老实说，我喜欢其他答案。简单而无需进入JS。但我注意到你问的是jQuery。因此，为了完整起见，在jQuery中如果使用.click（）处理程序返回false，它将取消窗口小部件的默认操作。

See here for an example（还有更多好东西）。 Here's the documentation, too

简而言之，使用示例代码，请执行以下操作：

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

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

作为一个额外的好处，有了这个，你可以摆脱锚标签，只需使用按钮。

Answer 6

如果不设置type属性，您也可以从false处理程序返回OnClick，并将onclick属性声明为onclick="return onBtnClick(event)"。

Answer 7

是的，您可以通过添加值按钮类型的属性来使按钮不提交表单： <button type="button"><button>

Answer 8

  <form class="form-horizontal" method="post">
        <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">
            <label class="control-label" for="inputPassword">Semester</label>
            <div class="controls">
                <select name="semester">
                    <option></option>
                    <option>1st</option>
                    <option>2nd</option>
                </select>
            </div>
        </div>

        <div class="control-group">
            <label class="control-label" for="inputPassword">Deskripsi</label>
            <div class="controls">
                    <textarea name="description" id="ckeditor_full"></textarea>
 <script>CKEDITOR.replace('ckeditor_full');</script>
            </div>
        </div>



        <div class="control-group">
        <div class="controls">

        <button name="save" type="submit" class="btn btn-info"><i class="icon-save"></i> Simpan</button>
        </div>
        </div>
        </form>

        <?php
        if (isset($_POST['save'])){
        $subject_code = $_POST['subject_code'];
        $title = $_POST['title'];
        $unit = $_POST['unit'];
        $description = $_POST['description'];
        $semester = $_POST['semester'];


        $query = mysql_query("select * from subject where subject_code = '$subject_code' ")or die(mysql_error());
        $count = mysql_num_rows($query);

        if ($count > 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
        }
        }

        ?>

我可以让<button>不提交表格吗？</button>

8 个答案: