jquery+ajax实现直接提交表单实例分析

前端技术 2023/09/03 JavaScript

本文实例讲述了jquery+ajax实现直接提交表单的方法。分享给大家供大家参考，具体如下：

这里给出查看帮助文档的例子

<script src=\"jquery-1.4.4.js\"></script>
<script>
$(function(){
  $(\"#results\").append( \"<tt>\" + $(\"form\").serialize() + \"</tt>\" );
});
</script>
<p id=\"results\"><b>Results: </b> </p>
<form>
 <select name=\"single\">
  <option>Single</option>
  <option>Single2</option>
 </select>
 <select name=\"multiple\" multiple=\"multiple\">
  <option selected=\"selected\">Multiple</option>
  <option>Multiple2</option>
  <option selected=\"selected\">Multiple3</option>
 </select><br/>
 <input type=\"checkbox\" name=\"check\" value=\"check1\"/> check1
 <input type=\"checkbox\" name=\"check\" value=\"check2\" checked=\"checked\"/> check2
 <input type=\"radio\" name=\"radio\" value=\"radio1\" checked=\"checked\"/> radio1
 <input type=\"radio\" name=\"radio\" value=\"radio2\"/> radio2
</form>

界面显示的内容是

直接使用ajax提交表单传递参数

$.ajax({
   type: \"POST\",
   url: url,
   data: $(\'#form1\').serialize(),
   success: function(msg){
    alert( \"Data Saved: \" + msg );
   }
});

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

本文地址：https://www.stayed.cn/item/6133

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案