Javascript適用於Firefox，但不適用於Chrome

Question

我的JavaScript代碼在Firefox中正常工作，但不在Chrome中。在Firefox中，只要選擇了該選項，就會顯示正確數量的表單（由JavaScript函數內的代碼構建），Chrome中沒有任何反應。我不知道爲什麼。我有一段時間沒有檢查過，因爲我主要使用Linux計算機，但我相信IE9也可以。

如果你能幫我找到我的解決方案，我會很感激。順便說一下，我的確看過另一個類似題目的問題，但似乎沒有回答這個問題。

<script type="text/javascript"> 
    function showForms(numForms) 
    { 
     // build the form 
     var form = ""; 
     for(i = 1; i <= numForms; i++) 
     {  
      // define one section of the form (give fields unique names). 
      var formPart = '<fieldset><legend>Add User</legend><label>Full Name:</label><input name="fullname' + i + '" type="text" required="required"" /><label>Email:</label><input name="email' + i + '" type="email" /><label>Phone:</label><input placeholder="1 (123)-123-1234" name="phone' + i + '" type="tel" /><label>Spreadsheet:</label><input name="spreadsheet' + i + '" type="file" /><label>Registration #:</label><textarea name="regnums' + i + '" placeholder="Aircraft registration number(s). Separate each number with a comma."></textarea></fieldset>'; 
      form = form + formPart; 
     } 
     // output the form to the page 
     var output = document.getElementById("output"); 
     output.innerHTML = form + '<input name="numForms" value="' + numForms + '" type="hidden" />'; 
    } 
</script> 

順便說一句，這個功能是通過<option onclick="showForms(#)">#</option>其中＃是要顯示的表格的數量調用。當然，選項位於<select>之內。

非常感謝您的幫助。

編輯：這裏是調用腳本，包含HTML，PHP & JavaScript。

<?php 
// include the javascript function to generate the form 
include ('../private/Includes/Scripts/showforms.js'); 

// form handling code 
if (isset($_POST['submit'])) 
{ 
    // make sure the input for the number of users is a number, and less than or 
    // equal to 10 
    if (is_numeric($_POST['numForms']) && $_POST['numForms'] <= 10) 
    { 
     $regCount = $_POST['numForms']; 
    } 

    // initialize array for form data 
    $regData = array(); 
    // fill array with multi-dimentional form data 
    for ($i = 1; $i <= $regCount; $i++) 
    { 
     // get form data and store in temporary variables 
     $fullname = trim($_POST['fullname' . $i]); 
     $email = trim($_POST['email' . $i]); 
     $phone = trim($_POST['phone' . $i]); 
     $spreadsheet = $_POST['spreadsheet' . $i]; 
     $regnums = trim($_POST['regnums' . $i]); 
     // put data in array 
     $regData[$i] = array(
      'username' => '', 
      'fullname' => $fullname, 
      'email' => $email, 
      'phone' => $phone, 
      'spreadsheet' => $spreadsheet, 
      'regnums' => $regnums 
     ); 
     // unset temporary variables 
     unset($invalid, $username, $fullname, $email, $phone, $spreadsheet, $regnums); 
    } 
    $errors = registerUsers($regData); 
    if ($errors[0] == "Some users were not registered due to missing usernames.") 
    { 
     $notes[] = "Some users were not registered due to missing usernames."; 
     unset($errors[0]); 
    } 
    if (!isset($errors)) 
    { 
     $success = true; 
    } 
} 
?> 
<h2 style="margin-top: -9px;">Register Users</h2> 
<p>Use this form to register new users. Usernames and passwords are automatically generated and emailed to their owner's addresses.</p> 
<form enctype="multipart/form-data" method="post"> 

    <fieldset> 
     <legend> 
      Form Setup &amp; Results 
     </legend> 
     <label>No. of User(s):</label> 
     <select onchange="showForms(0)" name="select"> 
      <option selected="selected">- Please Select -</option> 
      <option onclick="showForms(1)">1</option> 
      <option onclick="showForms(2)">2</option> 
      <option onclick="showForms(3)">3</option> 
      <option onclick="showForms(4)">4</option> 
      <option onclick="showForms(5)">5</option> 
      <option onclick="showForms(6)">6</option> 
      <option onclick="showForms(7)">7</option> 
      <option onclick="showForms(8)">8</option> 
      <option onclick="showForms(9)">9</option> 
      <option onclick="showForms(10)">10</option> 
     </select> 
    </fieldset> 
    <div id="output"></div> 
    <input id="submit" name="submit" type="submit" value="Submit" /> 
</form> 

Answer 1

我猜你有多個ID爲「output」的元素，因爲我在Chrome的堆棧中將這樣一個元素附加到此頁面上，執行了你的func定義，用8的參數解僱了它，一堆形式。協議棧使用的JQuery所以......

$('body').append('<div id="output"/>'); 

然後剪切和粘貼在控制檯來定義FUNC和...

showForms(8); 

您應該在頁面底部看到一堆垃圾形式的在堆棧中。另一種可能性是，您沒有ID爲「輸出」的元素

請務必首先檢查HTML。總是。這需要很少的時間。如果您的網站上有JQ，請在調用該功能之前執行此操作。

alert($('#output').size()); 

如果不是1，那就是你的問題。

Answer 2

語法錯誤 - 轉義「的HTML字符串

... + '" type="text" required="required"" /> 

使用一些IDE或智能編輯器，將節省您從這些錯誤

BTW一個把戲你： 。將代碼模板置於隱藏狀態（display：none）;然後，對於每個節點，將其複製到新節點並更改其ID，並將其放在正確的位置。第二技巧：使用您的服務器端lang支持像PHP的foo []而不是生成ID的數組。 IMO更好的方法。

Answer 3

我有一個類似的問題，最終導致在使用前未定義我的數組。 Firefox似乎更容忍處理未使用var語句顯式定義的數組，但Chrome需要定義它們。