簡體   English   中英

網頁上的多個Facebox:單獨的事件?

[英]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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM