Question

我使用purecss作为简单项目的基础。我目前遇到的问题是我有一个提交按钮，我将从字段中提取一些信息，点击后我想运行一些javascript，以及将用户带到另一个页面。这就是我没有运气的尝试：

    <div class="pure-controls">
        <button type="submit" class="pure-button pure-button-primary" onClick="saveInfo(this.form)" action="confirm.html">Submit</button>           
        <button type="submit" class="pure-button pure-button-primary">Search</button>
    </div>

Answer 1

为了简单起见，给你的按钮ID，并取出那个令人讨厌的内联JS。

<div class="pure-controls">
    <button type="submit" class="pure-button pure-button-primary" id="button1">Submit</button>           
    <button type="submit" class="pure-button pure-button-primary" id="button2">Search</button>
</div>

然后用你的脚本：

var el = document.getElementById("button1"); //cache the save button
el.addEventListener("click", function() {
    document.forms[0].submit(); //submit the form or save it etc
    window.location.href = "confirm.html";
}, false); //event handler

将表单数据发送到函数中，然后使用简单的重定向，因为只有表单元素具有操作属性。然后只需添加click事件，保存您想要的表单（提交，ajax调用，无关紧要），然后在回调中或如何进行，使用window.location.href重定向客户端

Answer 2

在您完成保存信息后，您可以将saveInfo()内的代码重定向到confirm.html。

window.location = "confirm.html"

Answer 3

你可以有按下按钮的Javascript事件处理程序，它可能类似于：

document.getElementById('buttonID').onclick=function(){
    //Do whatever processing you need
    document.getElementById('formID').submit();
};

或者，你可以在jQuery中有一个事件处理程序，它看起来像：

$('#buttonID').on('click',function(){
    // Do whatever processing you need
    $('#formID').submit();
});

Answer 4

<div class="pure-controls">
    <button type="submit" class="pure-button pure-button-primary" id="button1">Submit</button>           
    <button type="submit" class="pure-button pure-button-primary" id="button2">Search</button>
</div>

<script>
      $(document).ready(function() {
          $('#button1').click(function(){
             var form = $(this).parents('form');

             $.ajax({
                 type: 'POST',
                 url: $(this).attr('action'),
                 data: form.serialize(),
                 dataType: 'json',
                 success: function(response) {
                      window.location.href = "http://www.page-2.com";
                 }
             });
             return false;
           });
      });
</script>

Answer 5

您的表单也可以不提供类型提交.. 类型可以只是一个按钮..点击，你现在可以使用onclick =“javascript：somefunction（）”，

来做你所有的javascript内容

somefunction = function (){
Process javascript here 

document.formname.submit();

location.href = "new.html"

}

onClick和动作HTML

5 个答案: