如何在本地计算机上提交jquery页面

debugcn 发表于 Dev

安德鲁

<!DOCTYPE html>
<html>
<head>
    <title>Example</title>
    <script src="jquery-1.7.js" type="text/javascript"></script>
    <script src="jquery.tmpl.js" type="text/javascript"></script>
    <link rel="stylesheet" type="text/css" href="styles.css"/>
    <script type="text/javascript">
    $(document).ready(function() {
        var data = [
           { name: "Astor", product: "astor", stocklevel: "10", price: "2.99"},
           { name: "Daffodil", product: "daffodil", stocklevel: "12", price: "1.99"},
           { name: "Rose", product: "rose", stocklevel: "2", price: "4.99"},
           { name: "Peony", product: "peony", stocklevel: "0", price: "1.50"},
           { name: "Primula", product: "primula", stocklevel: "1", price: "3.12"},
           { name: "Snowdrop", product: "snowdrop", stocklevel: "15", price: "0.99"},
        ];

        var templResult = $('#flowerTmpl').tmpl(data);
        templResult.slice(0, 3).appendTo('#row1');
        templResult.slice(3).appendTo("#row2");

        $('input').focus(handleFormFocus).blur(handleFormFocus);

        function handleFormFocus(e) {
            var borderVal = e.type == "focus" ? "medium solid green" : "";
            $(this).css("border", borderVal);
        }     

    });
    </script>
    <script id="flowerTmpl" type="text/x-jquery-tmpl">
        <div class="dcell">    
            <img src="${product}.png"/>
            <label for="${product}">${name}: </label>
            <input name="${product}" value="0" required />
        </div>
    </script>
</head>
<body>
    <h1>Jacqui's Flower Shop</h1>
    <form method="post" action="http://node.jacquisflowershop.com/order">
        <div id="oblock">        
            <div class="dtable">
                <div id="row1" class="drow">
                </div>
                <div id="row2"class="drow">
                </div>            
            </div>
        </div>
        <div id="buttonDiv"><button type="submit">Place Order</button></div>                    
    </form>
</body>
</html>

你好，

我正在学习JQuery，但我想知道表单提交的输出。如何在本地计算机上提交表单。它不像.NET和使用localhost。

我该怎么办才能在本地计算机上获取JQuery摘要表格-在浏览器中只是纯文本

arkascha

好的，在考虑对问题的评论时，这可能会帮助您入门：

$(document).ready(function(){
  $('form').attr('action', '');
  $('form button').on('click', function(e){
    e.preventDefault();
    console.log('submit button clicked, here is the form to be posted: ');
    console.log($('form').serialize());
  });
});

这样可以防止提交表单并对提交按钮上的click事件做出反应。您可以输出任何您喜欢的内容。删除表单action属性的内容并不是真正需要的，这只是一项安全措施。

这是一个可以玩的jsfiddle：https ://jsfiddle.net/eghp78f2/

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。