[英]Javascript works in Firefox but not in Chrome
我的 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 & 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>
語法錯誤 - 未轉義 " 在 HTML 字符串中。
... + '" type="text" required="required"" />
使用一些 IDE 或智能編輯器,可以避免此類錯誤。
順便說一句,給你一個技巧:將代碼模板放入隱藏(顯示:無); 然后,對於每一個,將它復制到一個新節點並更改它的 ID,然后將它放在正確的位置。 請參閱 DOM 操作,W3C 標准的一部分。
第二個提示:使用服務器端對數組的 lang 支持,例如 PHP 的 foo[] 而不是生成 ID。 海事組織更好的方法。
我猜你有不止一個 ID 為“output”的元素,因為我只是將這樣一個元素附加到 Chrome 堆棧上的這個頁面,執行你的 func 定義,用參數 8 觸發它並得到一堆表格。 Stack 使用 JQuery 所以...
$('body').append('<div id="output"/>');
然后剪切並粘貼以在控制台中定義您的功能,然后...
showForms(8);
您應該在 Stack 的頁面底部看到一堆表單垃圾。 另一種可能性是您沒有 ID 為“output”的元素
始終首先檢查 HTML。 總是。 只需要很少的時間。 如果您的站點上有 JQ,只需在調用該函數之前執行此操作。
alert($('#output').size());
如果它不是 1,那是你的問題。
我有一個類似的問題,最終是由於在使用前沒有定義我的數組。 Firefox 似乎更能容忍未使用 var 語句明確定義的數組,但 Chrome 需要定義它們。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.