jQuery Img切换Ajax帖子
jQuery Img toggle Ajax post
我有两个图像,当我点击green.png时,它会变成red.png。但当我加载页面时,它已经设置为red.png,我需要点击img两次,然后它才会改变。我只想点击一次。
$(".page-state").toggle(function(event){
this.src = "images/red.png";
var id = event.target.id; //the Div ID variable
var dataString = 'page='+ id + '&view=off';
$.ajax({
type: "POST",
url: "pageState.php",
data: dataString,
cache: false,
});
$('#mainFrame')
.attr('src', $('iframe')
.attr('src'))
}, function(event) {
this.src = "images/green.png";
var id = event.target.id; //the Div ID variable
var dataString = 'page='+ id + '&view=on';
$.ajax({
type: "POST",
url: "pageState.php",
data: dataString,
cache: false,
});
$('#mainFrame')
.attr('src', $('iframe')
.attr('src'))
});
我该如何改进?
jQuery:
$(".page-state").click( function() {
var s = $(this).attr("class").split(" ");
if(s[1] == 'red') {
this.src = 'green.png';
$(this).removeClass('red').addClass('green');
// more code for green
}
else {
this.src = 'red.png';
$(this).removeClass('green').addClass('red');
// more code for red image
}
});
HTML:
<img class="page-state red" src="red.png" />
正如您所看到的,.page-state
有一个类,它表示默认情况下由红色或蓝色组成。
相关文章:
- Javascript/jQuery压缩一个图像正确的评论帖子,并使用Ajax Laravel 5.2保存到控制器中
- ajax帖子返回html
- 已将POST更改为GET.现在Ajax正在返回多个帖子
- 如何使用帖子(ajax)执行IF / ELSE
- 尝试在 jquery ajax 帖子中将变量设置为URL 的一部分
- 将单击事件附加到按钮或链接上的类,该按钮或链接会触发 AJAX 帖子,然后延迟并继续原始操作
- 如何触发带有第一个请求(Windows 身份验证)的授权标头的 AJAX 帖子
- 窗口确认在 AJAX 帖子中打印 HTML 标签
- Ajax WordPress 帖子弹出窗口与 SimpleModal 和 jQuery
- 制作更快的jQuery AJAX帖子
- 而jquery ajax帖子中的循环
- Jquery Ajax.用tampermonkey发送带有输入值的帖子
- ajax和json错误.php帖子错误
- 帖子不会立即使用 ajax 发送
- 使用Ajax和Jquery一次加载100个块的Wordpress帖子
- Ajax 帖子未捕获语法错误:意外令牌非法
- 多格式ajax帖子
- 如何使用ajax从所有帖子中获取第一个图像
- 我想使用 ajax 和 PHP 获取每个帖子数据的点赞总数
- 编辑帖子AJAX,PHP,javascript