我的网站http://broadcasted.tv/上有一个评级系统功能。可以在这里看到:
它是提示中的一种形式,用于添加和删除评分。但是在我的网站(示例页面http://broadcasted.tv/show/47/arrested-development/)上,当我在提示中(在页面底部)获得一个节目时,同时发送了六个请求并且我不明白为什么(我是 jQuery 新手)
对于那些想在网站上查看请求的人,我在那里创建了一个测试帐户:
用户名:stackoverflowhelp 密码:testtest
这是具有ajax调用的函数部分
$(".showscoreupqtip").click(function () {
var button = $(this);
if ($(button).hasClass("removeshowscoreqtipup")) {
var show_id = button.siblings(".show_id").val();
var user_id = button.siblings(".user_id").val();
var score = $('input[name="tvshowrating-' + show_id + '"]:checked').val();
$.ajax({
type: "POST",
url: "/showscoreajaxremove.php",
data: {
"show_id": show_id,
"user_id": user_id,
"score": score //we are passing the name value in URL
},
cache: false,
success: function (data) {
location.reload();
}
});
} else {
var show_id = button.siblings(".show_id").val();
var user_id = button.siblings(".user_id").val();
var score = $('input[name="tvshowrating-' + show_id + '"]:checked').val();
if (show_id == '') {
$('#show_id').addClass('error');
return;
} else {
button.removeClass('error');
$.ajax({
type: "POST",
url: "/showscoreajax.php",
data: {
"show_id": show_id,
"user_id": user_id,
"score": score
},
cache: false,
success: function (data) {
button.val('Scored');
button.addClass('success');
button.addClass('removeshowscoreqtipup');
button.removeClass('addshowscoreinqtip ');
if (data !== 'error') {
$('#up-' + show_id).replaceWith('<div class="rating-recent-text">' + data + '</div>');
}
}
});
}
}
});
编辑:(整个功能)
$(function () {
$('.tip-tvshow').each(function () {
var tipContent = $(this).next('.tip-content').clone();
$(this).qtip({
content: tipContent,
prerender: 'true',
show: {
ready: 'true',
},
hide: 'mouseout',
position: {
adjust: {
method: 'flip'
},
my: 'bottom middle', // Position my top left...
at: 'top middle', // at the bottom right of...
target: $(this) // my target
},
viewport: $(window),
style: {
classes: 'mytip',
tip: {
corner: true,
mimic: false,
method: true,
width: 18,
height: 8,
border: 1,
offset: 0,
}
},
events: {
render: function () {
$('.tvshowrating').submit(function () {
$('.test', this).html('');
$('input', this).each(function () {
if (this.checked) $('.test', this.form).append('' + this.name + ': ' + this.value + '<br/>');
});
return false;
});
$(".showscoreupqtip").click(function () {
var button = $(this);
if ($(button).hasClass("removeshowscoreqtipup")) {
var show_id = button.siblings(".show_id").val();
var user_id = button.siblings(".user_id").val();
var score = $('input[name="tvshowrating-' + show_id + '"]:checked').val();
$.ajax({
type: "POST",
url: "/showscoreajaxremove.php",
data: {
"show_id": show_id,
"user_id": user_id,
"score": score //we are passing the name value in URL
},
cache: false,
success: function (data) {
location.reload();
}
});
} else {
var show_id = button.siblings(".show_id").val();
var user_id = button.siblings(".user_id").val();
var score = $('input[name="tvshowrating-' + show_id + '"]:checked').val();
if (show_id == '') {
$('#show_id').addClass('error');
return;
} else {
button.removeClass('error');
$.ajax({
type: "POST",
url: "/showscoreajax.php",
data: {
"show_id": show_id,
"user_id": user_id,
"score": score
},
cache: false,
success: function (data) {
button.val('Scored');
button.addClass('success');
button.addClass('removeshowscoreqtipup');
button.removeClass('addshowscoreinqtip ');
if (data !== 'error') {
$('#up-' + show_id).replaceWith('<div class="rating-recent-text">' + data + '</div>');
}
}
});
}
}
});
$('.hover-star').rating({
focus: function (value, link) {
// 'this' is the hidden form element holding the current value
// 'value' is the value selected
// 'element' points to the link element that received the click.
var tip = $('#hover-test');
tip[0].data = tip[0].data || tip.html();
tip.html(link.title || 'value: ' + value);
},
blur: function (value, link) {
var tip = $('#hover-test');
$('#hover-test').html(tip[0].data || '');
}
});
},
},
hide: {
when: 'unfocus',
fixed: true
},
show: {
when: 'mouseover',
solo: true // Only show one tooltip at a time
},
});
});
});