[英]Multiple Facebox on webpage: Separate events?
我的網頁中有兩個Facebox。 但是我的問題是兩個面板中的“提交”按鈕,無論我對第一個面板進行了警報,它也將對第二個面板進行警報。
我之所以擁有兩個facebox,是因為我有一個包含兩個表單的菜單,所以每個表單都使用facebox。
菜單:
配置播客上傳音樂
當我觸發提交按鈕來配置播客表單時。 它將觸發一條消息“播客描述已被編輯”。 然后,當我單擊“上載音樂”中的“提交”按鈕時,在以“上載音樂”形式顯示我的消息之前,還將顯示“配置播客”形式的消息。 請幫忙,
這是我的兩種形式的代碼:
<br/>
For upload music:
<br/><br/>
<script>
$(document).ready(function(){
$('#audioFile').uploadify({
'uploader' : 'jquery/js/uploadify/uploadify.swf',
'script' : 'jquery/js/uploadify/uploadify.php',
'cancelImg' : 'jquery/js/uploadify/cancel.png',
'folder' : 'uploaded/podcastUpload/audio',
'fileExt' : '*.mp3',
'method' : 'post',
'fileDesc' : 'MP3 Files',
'onComplete' : function(event, ID, fileObj, response, data) {
$(".close").click();
for (var i=0; i < document.jform.explicit.length; i++)
{
if (document.jform.explicit[i].checked){
var rad_val = document.jform.explicit[i].value;
}
}
var dataString = 'action=PodcastData&jobid=<?=$jobid?>&title=' + $("#title").val() + '&authorName=' + $("#authorName").val() + '&authorEmail=' + $("#authorEmail").val() + '&description=' + $("#description").val() + '&categories=' + $("#categories").val() + '&keywords=' + $("#keywords").val() + '&explicit=' + rad_val + '&fileNameAudio=' + fileObj.name + '&linkAudio=' + fileObj.filePath;
$.ajax({
cache: 'false',
type: "POST",
url: "ajaxfunction.php",
data: dataString,
success: function(msg){
$(".close").click();
alert('File Has been uploaded successfully!');
}
});
}
});
$(".submit").click(function(){
javascript:$('#audioFile').uploadifyUpload($('.uploadifyQueueItem').last().attr('id').replace('audioFile',''));
});
});
<br/><br/><br/><br/><br/><br/><br/>
對於配置播客:
<br/><br/>
<script>
$(document).ready(function(){
$('#imageFile').uploadify({
'uploader' : 'jquery/js/uploadify/uploadify.swf',
'script' : 'jquery/js/uploadify/uploadify.php',
'cancelImg' : 'jquery/js/uploadify/cancel.png',
'folder' : 'uploaded/podcastUpload/image',
'fileExt' : '*.jpg;*.gif;*.jpeg',
'fileDesc' : 'Image Files',
'method' : 'post',
'onComplete' : function(event, ID, fileObj, response, data) {
$(".close").click();
}
});
$(".submit").click(function(){
javascript:$('#imageFile').uploadifyUpload($('.uploadifyQueueItem').last().attr('id').replace('imageFile',''));
for (var i=0; i < document.pDescrForm.pExplicit.length; i++)
{
if (document.pDescrForm.pExplicit[i].checked){
var rad_val = document.pDescrForm.pExplicit[i].value;
}
}
var dataString = 'action=newPodcastDescr&jobid=<?=$jobid?>&pTitle=' + $("#pTitle").val() + '&pAuthorName=' + $("#pAuthorName").val() + '&pAuthorEmail=' + $("#pAuthorEmail").val() + '&pDescr=' + $("#pDescr").val() + '&pSubtitle=' + $("#pSubtitle").val() + '&pCopyright=' + $("#pCopyright").val() + '&pExplicit=' + rad_val;
$.ajax({
cache: 'false',
type: "POST",
url: "ajaxfunction.php",
data: dataString,
success: function(msg){
$(".close").click();
alert('New Podcast description has been added');
}
});
});
});
</script>
在音樂形式的代碼中查看以下代碼:
$(".submit").click(function(){ ...
然后在播客表單代碼中找到相同的內容。 您的提交按鈕與單擊事件綁定了兩次。 jQuery選擇器找到所有匹配的元素,並將事件綁定到所有這些元素。 如果您第二次綁定事件,則jQuery會生成事件回調堆棧,然后依次運行它們。
更改提交按鈕的類(因為您需要唯一的選擇器),或者如果您不想破壞CSS,請添加另一個(例如音樂和播客)並按如下方式使用它:
$(“。submit.music”)。click(function(){... $(“。submit.podcast”)。click(function(){...
這應該只觸發一個回調。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.