私のウェブサイトhttp://broadcasted.tv/に評価システムの機能があります。ここで見ることができます:
これは、評価を追加および削除するヒント内のフォームです。ただし、私のウェブサイト (サンプル ページhttp://broadcasted.tv/show/47/arrested-development/ ) では、ヒント (ページの下部) でショーを採点すると、6 つのリクエストが同時に送信され、理由がわかりません(jQueryは初めてです)
Web サイトでリクエストを確認したい方のために、テスト アカウントを作成しました。
ユーザー名: 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
},
});
});
});