使用jQuery的.post()方法仅选择HTML页面的一部分?
|
我有一个具有投票民意调查模块的网站。轮询控制器通过“ 0”请求接受投票,该请求包含轮询ID和响应ID作为“ 1”的参数。
该站点的站点范围模板在侧边栏中具有当前民意调查。一种简单的形式,将“ 2”属性设置为上述网址。但是,我正在用jQuery劫持这一点,以异步方式提交投票。
这是我到目前为止拥有的功能:
$(\'form.poll\').submit(function() {
var form = this;
var response = $(\'div.response\', form);
if ($(\'input:checked\', form).length == 0) {
response.fadeOut(\'fast\', function() {
$(this).html(\'<p class=\"error\">Please select an option.</p>\').fadeIn(\'fast\');
})
}
else {
var action = $(form).attr(\'action\');
$.post(action, $(form).serialize(), function(data) {
alert(\'Data loaded: \' + data);
});
$(\'fieldset\', form).fadeOut(\'fast\');
response.fadeOut(\'fast\', function() {
$(this).html(\'<p class=\"success\">Vote successfully added.</p>\').fadeIn(\'fast\');
});
}
return false;
});
如您所见,它仅拦截提交的表单,然后使用jQuery而不是整页请求执行POST
,因此访问者永远不会离开他们所在的页面。
我的问题是:整个页面的HTML都返回$.post
响应(带有alert()
调用的行)。我如何挑选返回的HTML的#content
<div>
标签的内容,以用作我的民意调查表中的响应?投票表的标记为:
<form action=\"/poll\" method=\"post\" id=\"poll\" class=\"poll\">
<h3>Poll</h3>
<p class=\"question\">Who do you think will win the Lockdown main event?</p>
<div class=\"response\"><!--//--></div>
<fieldset>
<input type=\"hidden\" name=\"poll\" value=\"1\" />
<ul class=\"options\">
<li><label for=\"option_1\"><input type=\"radio\" name=\"response\" value=\"1\" id=\"option_1\" /> Mr Anderson</label></li>
<li><label for=\"option_2\"><input type=\"radio\" name=\"response\" value=\"2\" id=\"option_2\" /> Rob Van Dam</label></li>
<li><label for=\"option_3\"><input type=\"radio\" name=\"response\" value=\"3\" id=\"option_3\" /> Sting</label></li>
</ul>
<input type=\"submit\" name=\"vote\" value=\"Vote\" class=\"button\" />
</fieldset>
</form>
我想将响应插入恰当命名的.response
div
标签中。任何帮助,指示或建议将不胜感激。
没有找到相关结果
已邀请:
5 个回复
抢垢洛韧
畦桨存灯
在此处找到有效的演示:http://jsfiddle.net/ezmilhouse/BSrk6/
甲车劲
我认为,应该只允许您访问#content div。不太好,因为它需要解析整个HTML。
究补闯
/
时遇到问题,因此我使用了以下方法。 您可能想要做的是将数据应用于新的,隐藏的临时元素,然后照常从那里访问它。
辅奈