Firefox 中的形式动力学中断

Question

I am currently in the process of creating a simple CMS designed specifically for the needs of my customer.我目前正在创建一个专门为满足客户需求而设计的简单 CMS。 The overall design uses a mysql database to store the page data in a table, and then those pages are accessed and displayed using AJAX.整体设计使用 mysql 数据库将页面数据存储在一个表中，然后使用 AJAX 访问和显示这些页面。 I have come to the part where I need to add the page editing features, And as part of that I need a form that has a list of all the current pages in the site, so the user can select the page to edit (as well as other functions) The way it currently works the browser make a request for the "admin" or edit page and then the PHP then constructs the form according to the required parameters, stores it as a string of html, and returns it via "echo."我已经到了需要添加页面编辑功能的部分，作为其中的一部分，我需要一个包含站点中所有当前页面列表的表单，以便用户可以 select 编辑页面（以及作为其他功能）它当前的工作方式浏览器向“管理”或编辑页面发出请求，然后PHP然后根据所需的参数构造表单，将其存储为html的字符串，并通过“回显”返回。” (once again, using AJAX) （再一次，使用 AJAX）

The First test put all the rows in the "page" table into an HTML select box.第一个测试将“页面”表中的所有行放入 HTML select 框中。 The second attempt was to list all the rows in a div with overflow:auto.第二次尝试是使用overflow:auto 列出div 中的所有行。

In both cases things worked without flaw in IE, but Firefox does not allow the select box to open, or the div to scroll.在这两种情况下，在 IE 中都可以正常工作，但 Firefox 不允许 select 框打开或 div 滚动。

any Ideas?有任何想法吗？

Thanks谢谢

EDIT:编辑：

Heres the code.这是代码。 I did some further testing to try and remove anything that could be causing the problem.我做了一些进一步的测试，试图删除任何可能导致问题的东西。 I copied the code generated by the php and saved it as an html document.我复制了 php 生成的代码，并将其保存为 html 文档。 It continued to exhibit the same behavior in firefox.它在 firefox 中继续表现出相同的行为。 I removed all the javascript so it was just HTML.我删除了所有 javascript，所以它只是 HTML。 the only thing that caused it to work properly was when I copied the html file onto my desktop (so it was no longer on my xampp webserver.) this caused the form to work again.导致它正常工作的唯一原因是当我将 html 文件复制到我的桌面上时（所以它不再在我的 xampp 网络服务器上。）这导致表单再次工作。

EDIT: again: It seems to be related to my CSS document, but I cant figure out what in my CSS would be causing the form to break.编辑：再次：它似乎与我的 CSS 文档有关，但我无法弄清楚我的 CSS 中的什么会导致表单中断。 ideas?想法？

Heres the HTML and the CSS below that:下面是 HTML 和 CSS ：

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>
    <title>On Semiconductor Corporate IP Website</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">      

    <link rel="stylesheet" type="text/css" href="css/headerCSS.css">



</head>

<body>
  <div id="header">
     <div id="header_top_layer">   <!-- SET WITH HERE -->
        <div id="logo"></div>

        <div id="title_wrapper">
           <div id="page_title">
              <div id="large_text">Corporate R&amp;D</div>

              <div id="small_text">Intellectual Property</div>
           </div>
        </div>
     </div>
  </div>

     <div class="clear_float"></div>



     <div class="clear_float"></div>


  <div id="main_container">
     <div id="background">
        <div id="container">       <!-- SET WITH HERE -->

           <div id="sidebar">
           </div>


           <div id="main">        
              <div id="content">
                 <form action="" method="post">
                    <input name="lastname" type="text"><br>
                    <select id="selectBox">
                       <option value="1">Home</option>
                       <option value="2">Foundation IP</option>
                       <option value="3">Memories</option>
                       <option value="4">Analog IP</option>
                       <option value="5">System IP</option>
                       <option value="6">Search</option>
                       <option value="7">Login</option>
                       <option value="8">Admin</option>
                    </select><br>
                    <input value="Submit" type="submit">
                 </form>
              </div>
           </div>
        </div>

     </div>
     <div id="bottom_bookend">
        <div id="bbColor"></div>
        <img src="Images/bottomDiagonal.png" id="bbImage">
     </div>

  </div>

And the CSS in a pastebin because it was rather long:以及粘贴箱中的 CSS 因为它相当长：

http://pastebin.com/7hBiWz85 http://pastebin.com/7hBiWz85

Answer 1

I too believe you should turn your focus out of database and anything else and concentrate in html only.我也相信你应该把注意力从数据库和其他任何事情上转移开，只专注于 html。

You already know browsers do have differences, I remeber my self having the same problem with select boxes in firefox and after trying different things I solved it.您已经知道浏览器确实存在差异，我记得我自己对 firefox 中的 select 盒子有同样的问题，在尝试了不同的事情后我解决了它。 For example (if I am not wrong there are two different syntax for selected)..例如（如果我没记错的话，有两种不同的语法可供选择）..

As for div I have found that the most reliable divs that work well every where are those defined as absolute position, and luckily I discovered that building pages with absolute position was much more easier, simplier and cleaner for me!至于 div，我发现在任何地方都能正常工作的最可靠 div 是那些被定义为绝对 position 的 div，幸运的是，我发现用绝对 position 构建页面对我来说更容易、更简单、更干净！

Answer 2

Turns out it was a layering problem and I'm just a moron.原来这是一个分层问题，我只是个白痴。

In my CSS I made the container with the form in it have a z-index of -2.在我的 CSS 中，我使包含表单的容器的 z-index 为 -2。 This caused another div to be on top of the form preventing the user from clicking on the form elements.这导致另一个 div 位于表单顶部，阻止用户单击表单元素。

Thank you to whoever looked at this question.感谢看到这个问题的人。

Firefox 中的形式动力学中断

问题描述

2 个解决方案

解决方案1
2 2011-05-31 22:40:44

解决方案2
1 已采纳 2011-06-01 17:39:38

Firefox 中的形式动力学中断

问题描述

2 个解决方案

解决方案1 2 2011-05-31 22:40:44

解决方案2 1 已采纳 2011-06-01 17:39:38

解决方案1
2 2011-05-31 22:40:44

解决方案2
1 已采纳 2011-06-01 17:39:38