JQuery Popup Form Dialog не работает в Firefox, но хорошо в Chrome & IE

0

Мои коды поддерживают работу в Chrome и IE, но не работают в Firefox. Я использую JQuery для открытия формы всплывающего окна при нажатии Bad Data? отправить электронное письмо. В Chrome и IE он открывает всплывающее окно div, но в Firefox это не так. Пожалуйста, любезно помогите. Большое спасибо.

<!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>"; ?>
Теги:
firefox

1 ответ

1

Я создал скрипку из вашего кода, пожалуйста, проверьте.

ниже код работает отлично как в хром, так и в FF.

$(function() {

 $("#email_architects").click(function(event) {
   $( "#dialog-form" ).addClass("visible");
   $( "#dialog-form" ).dialog();
 });
});
Поделиться
  • 0
    Привет @Sandeeproop большое спасибо за ваш вклад и jfiddle. Однако, когда я изменил код на «dialog ()», он все равно не работает для меня. Есть ли какие-то правила в использовании Jquery в Firefox? Благодарю.
  • 0
    Должна быть какая-то другая ошибка, проверьте консоль ошибок Firebug.
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню