我只能在页面正文中插入代码。我需要通过Ajax提交表单并将字符串发送到服务器应用程序。所以我使用jQuery
表单插件。这是我尝试添加的代码:
<script src='http://somesite.ru/interactive/jquery-1.8.3.min.js'></script>
<script src='http://malsup.github.io/min/jquery.form.min.js'></script>
<link rel='stylesheet' type='text/css' href='http://somesite.ru/interactive/somesite_interactive.css'>
<div id='question_block'>
<b>You can left your question at the form right here:</b>
<form action='http://somesite.ru/interactive/question' id='interactive_form'>
<span>Your name:</span><input type='text' name='sender' size='64'>
<textarea name='question_text'></textarea>
<input type='button' id='interactive_submit_question' value='Отправить'>
</form>
<script type='text/javascript'>
$("#interactive_submit_question").click(function(){
$("#interactive_form").ajaxSubmit();
$("#interactive_question_block").html("<b>Thanks! Your question was submited successfully.</b>");
});
</script>
页面加载时我没有收到任何错误,但是当我点击按钮时
“TypeError:$(...)。ajaxSubmit不是函数”。
但我只是用
导入表单插件<script src='http://malsup.github.io/min/jquery.form.min.js'></script>
更新
看起来问题是在这个页面已经加载了jQuery(2次)和旧版本的表单插件。我只是用一个简单的函数$ .post()将数据发送到我的服务器。
答案 0 :(得分:2)
为什么不使用$ .ajax?同样简单,您可以更好地控制提交的内容。
答案 1 :(得分:2)
你真的需要ajaxSubmit方法吗?你可以试试这个:
<script type='text/javascript'>
$(document).ready(function() {
var helper = {};
helper.parseFormData = function parseFormData(form) {
var json = {};
form.find("[name]").each(function() {
var _name = $(this).attr("name")
, _value = $(this).attr("value");
json[_name] = _value;
});
return json;
};
helper.submitForm = function submitForm(form, callback) {
var _data = helper.parseFormData(form)
, _url = form.attr("action")
, _type = form.attr("method");
$.ajax({
type: _type,
url: _url,
data: _data,
success: function(content, p2, p3) {
callback(content);
},
error: function(p1, p2, p3) {
callback(null);
}
});
};
// submit form on button click
$("#interactive_submit_question").click(function(){
helper.submitForm($("#interactive_form"), function() {
$("#interactive_question_block").html("<b>Thanks! Your question was submited successfully.</b>");
});
});
});
</script>