javascript 中的輸入字段樣式屬性在 chrome 中工作正常，而在 Firefox 中不起作用

Question

在我的文件上傳字段頁面中，我在 javascript 中設置了屬性樣式，如下所示

choicefile.setAttribute("style", "width: 86px;
                                  position: absolute;
                                  margin-left: 83px;  //This pixels shows the upload field in a correct place
                                  margin-top: 90px;  // This pixels shows the upload field in a correct place
                                  z-index: 1;
                                  opacity: 0;");

但是在 Firefox 中，它在錯誤的地方顯示文件上傳。 在 Firefox 中，如果我們將兩個屬性更改為

choicefile.setAttribute("style", "width: 86px;
                                  position: absolute;
                                  margin-left: 35px;  //In Firefox it is the correct pixels
                                  margin-top: 150px;  //In Firefox it is the correct pixels
                                  z-index: 1;
                                  opacity: 0;");       

我怎么解決這個問題。 任何人都可以幫助解決這個問題。 提前致謝

我的網址是

http://mytest.php?id=2&mview=69

單擊 addnewentry 后，文件上傳器顯示在正確的位置，但在 Firefox 中顯示在錯誤的位置。

<form name="choiceadd" action="" method="post" enctype="multipart/form-data" onsubmit="return validationaddchoice();">
<span id="addnewcontain">
</span>
<input type="hidden" name="choicecount" value="0" />
<div class="four" style='margin-top:40px;'>
<input type="button" value="Add New Entry" onclick="addnewchoice(document.forms['choiceadd']['choicecount'].value)" >
</div>
<div class="five">
<input type="submit" name="choiceaddsubmit" class="choiceaddsubmit" />
</div>
</form>

以上是主頁中的表格。 當點擊這個按鈕時，函數 addchoice 被調用，它包括上面提到的choicefile 屬性樣式

功能是

function addnewchoice(val)
{choicefile.setAttribute("style", "width: 86px; position: absolute; margin-left: 83px; margin-top: 90px; z-index: 1; opacity: 0;");
}

Answer 1

而不是像這樣設置樣式，您可以像下面那樣進行完全跨瀏覽器兼容性。分配每個樣式屬性，如下所示

而不是設置樣式

function addnewchoice(val)
{   
   choicefile.setAttribute("style", "width: 86px; position: absolute; margin-left: 83px; margin-top: 90px; z-index: 1; opacity: 0;");
}

您可以這樣設置以實現跨瀏覽器兼容性

function addnewchoice(val)
    choicefile.style.width="86px";
    choicefile.style.position="absolute";
    ... so on..
}

Answer 2

這個問題的完美答案是

<style>
   @-moz-document url-prefix() {
                       .testview{
                      width: 86px;
                      position: absolute;
                      margin-left: 35px;
                      margin-top: 90px;
                      z-index: 1;
                      opacity: 0;
                    }
                 }
</style>

如果瀏覽器是 mozilla firefox，則將上述帶有相應屬性的樣式應用於頁面。 如果瀏覽器是 chrome 意味着將應用默認樣式