jQuery技术:使用JavaScript获取表单数据并使用Ajax发送数据

编辑:发现问题。 将name =“demo_name”和我的表单上的这些项目更改为id =“demo_name”修复它。 谢谢@Jill

我正在尝试使用jquery的ajaxfunction将联系表单数据插入MySQL数据库。 我是新手,它部分工作,但数据以“未定义”的forms插入数据库,而不是输入的值,如姓名,电话等。有人可以帮助我查明可能导致它的原因吗? (部分在斯洛伐克,但我把重要的部分翻译成英文)

html页面(只是表单段):

Order a demo lesson!

Na Vaše otázky velmi radi co najskôr zodpovieme.
Prípadná ukážková hodinu je zdarma a nezáväzná.

使用Javascript / jQuery的:

 $(function() { $(".btn").click(function() { // validate and process form here var demo_name = $("input#demo_name").val(); var demo_age = $("input#demo_age").val(); var demo_email = $("input#demo_email").val(); var demo_phone = $("input#demo_phone").val(); var demo_where = $("input#demo_where").val(); var demo_text = $("input#demo_text").val(); var dataString = 'demo_name='+ demo_name + '&demo_age=' + demo_age + '&demo_email=' + demo_email + '&demo_phone=' + demo_phone + '&demo_where=' + demo_where + '&demo_text=' + demo_text; $.ajax({ type: "POST", url: "../php/demo_register.php", data: dataString, success: function() { $('#demo_form').html("
"); $('#message').html("

Contact Form Submitted!

") .append("

We will be in touch soon.

") } }); return false; }); });

php脚本:

  

    你应该在这个表单下有dataString

     var dataString = {demo_name: demo_name, demo_age: demo_age, and_so_on: and_so_on}; 

    更优选的方式:

     var dataString = $("form[name='demo']").serialize(); 

      以上就是jQuery教程分享使用JavaScript获取表单数据并使用Ajax发送数据相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/532614.html

      (0)
      上一篇 2020年12月21日
      下一篇 2020年12月21日

      精彩推荐