JavaScript可在IE中使用，但不能在Firefox中使用

Question

在我的.NET項目中，我正在HTML頁面中使用一個帶隱藏<div>的按鈕。 <div>包含用於插入公司的表格。

HTML：

<div class="top-div-where-is-my-ADD-button">
    <h2>
        Search:
        <input type="text" id="search" />
        <div id="divADD" onclick="AddCompany()">
            <span>Add Company</span></div>
    </h2>
</div>

    <div id="hide" style="visibility: hidden; height: 0px; padding-bottom: 10px;">
    <table id="CompanyDetails" class="company" style="width: 100%; text-align: center;">
.........
</div>

JavaScript的：

function AddCompany() {
    HideCompany();
    $(hide).css({ visibility: "visible", height: "auto" });
    var a = document.getElementById("divbuttonSaveCompany");
    a.onclick = InsertCompany; 
}

function InsertCompany() {
    var a = document.getElementById("Name").value;
    var b = document.getElementById("Address").value;
    var c = document.getElementById("Country").value;
    var d = document.getElementById("Phone").value;
    var e = document.getElementById("Fax").value;
    var f = document.getElementById("Email").value;
    var gg = document.getElementById("Contact");
    var g = gg.options[gg.selectedIndex].value;
    $.ajax({
        url: '@Url.Action("AddCompany", "Company")',
        data: { nameCompany: a, address: b, country: c, phone: d, fax: e, email: f , contact: g},
        dataType: "html",
        type: "POST",
        error: function () {
            alert("error");
        },
        success: function (data) {
            alert("Company was successfully added! ");
            $("#all").html(data);
        }
    });
}
function HideCompany() {
    $(hide).css({ visibility: "hidden", height: "0" });
    $("#Name").val("");
    $("#Address").val("");
    $("#Country").val("");
    $("#Phone").val("");
    $("#Fax").val("");
    $("#Email").val("");
}

所以基本上在IE中，當我按下按鈕AddCompany時，會出現隱藏的<div> ，但在FF中卻沒有。

有誰知道我需要做些什么來解決這個問題？

Answer 1

問題是這樣的：

$(hide)

這在IE中有效，因為IE從每個帶有“ id”的元素中創建一個全局變量。 Firefox不會這樣做。

將所有對$(hide)引用更改為$('#hide') 。

Answer 2

使用jQuery的hide函數隱藏一個元素，並使用show函數顯示它。

將高度設置為0是非標准的。

Answer 3

您是否嘗試過使用display屬性而不是可見性 ？

使用可見性時 ，元素即使不顯示也會占用空間，而使用display元素則不占用空間，因此您無需擔心高度 。

另外，您似乎正在使用jQuery，是否可以使用來顯示div的可見性

$（隱藏）.show（）;

$（隱藏）.hide（）;

或簡單地

$（隱藏）.toggle（）;

這些是使用css display屬性的jQuery快捷方式（請參閱doc）