Firefox에서는 JQuery 팝업 양식 대화 상자가 작동하지 않지만 Chrome 및 IE에서는 괜찮습니다.

내 코드는 Chrome 및 IE에서 작동하지만 Firefox에서는 작동하지 않습니다. 잘못된 데이터를 클릭 할 때 JQuery를 사용하여 팝업 div 형식을 여는 중입니까? 이메일을 보낼 수 있습니다. Chrome과 IE에서는 팝업 div 형식을 열지 만 Firefox에서는 그렇지 않습니다. 친절하게 도와주세요. 대단히 감사합니다.Firefox에서는 JQuery 팝업 양식 대화 상자가 작동하지 않지만 Chrome 및 IE에서는 괜찮습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Process Detail</title> 
<link href="baf.css" rel="stylesheet" type="text/css" /> 

<!-- Email CSSs and Javascripts - Start --> 
<link rel="stylesheet" href="..\js\jquery-ui-1.10.4.custom\development-bundle\themes\ui-lightness\jquery-ui.css"> 
<style> 
.font62Percent { font-size: 80%; } 
label.email_label, input.email_input { display:block; } 
input.text { margin-bottom:5px; width:95%; padding: .2em; } 
fieldset { padding:0; border:0; margin-top:10px; } 

.ui-dialog .ui-state-error { padding: .3em; } 
.validateTips { border: 1px solid transparent; padding: 0.3em; } 
.invisible {visibility:hidden; position:absolute; opacity: .99; z-index:2;} 
.visible {visibility:visible;} 
</style> 

<script src="..\js\jquery-ui-1.10.4.custom\js\jquery-1.10.2.js"></script> 
<script src="..\js\jquery-ui-1.10.4.custom\development-bundle\ui\jquery-ui.custom.js"></script> 
    <script> 
$(function() { 

    //get a reference to the element 
    var myBtn = document.getElementById('email_architects'); 
    //add event listener 
    myBtn.addEventListener('click', function(event) { 
     $("#dialog-form").addClass("visible"); 
     $("#dialog-form").dialog("open"); 
    }); 
    }); 
</script> 
<!-- Email CSSs and Javascripts - End --> 

</head> 

<body> 


<!-- Email Form - Start --> 
    <div id="dialog-form" title="Report Bad Data" class="font62Percent invisible"> 
    <form> 
    <p class="validateTips">All form fields are required.</p> 
    <fieldset> 
     <label class="email_label" for="mail_title">Title</label> 
     <input type="text" name="mail_title" id="mail_title" class="text ui-widget-content ui-corner-all email_input"> 
     <label class="email_label" for="mail_message">Message</label> 
     <textarea rows="10" cols="78" name="mail_message" id="mail_message" class="text ui-widget-content ui-corner-all email_input">Enter your message here...</textarea> 
    </fieldset> 
    </form> 
</div> 
<!-- Email Form - End --> 

<?php echo "<br> <button id='email_architects'>Bad Data?</button>"; ?>

출처

2014-04-25 Jemru

코드에서 fiddle을 만들었습니다.

아래 코드는 크롬과 FF에서 모두 잘 작동합니다.

$(function() { 

$("#email_architects").click(function(event) { 
    $("#dialog-form").addClass("visible"); 
    $("#dialog-form").dialog(); 
}); 
});

출처

2014-04-25 10:08:05 Sandeeproop

안녕하세요 @Sandeeproop 귀하의 의견을 보내 주셔서 감사합니다. 그러나 코드를 "dialog()"로 변경하면 여전히 작동하지 않습니다. Firefox에서 Jquery를 사용할 때 어떤 규칙이 있습니까? 감사. – Jemru

다른 오류가 발생했습니다. 방화 광 경고 콘솔을 확인하십시오. – Sandeeproop

안녕하세요 @Sandeeproop, 나는 방화범이 끌 렸는지 확인해 봤는데 오류가있어. ReferenceError : $가 정의되지 않았다. \t $ (function() { – Jemru

Firefox에서는 JQuery 팝업 양식 대화 상자가 작동하지 않지만 Chrome 및 IE에서는 괜찮습니다.

답변

관련 문제