2

ファイルアップロードフィールドの私のページで、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では、2つの属性を次のように変更すると

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;");       

どうすればこの問題を解決できますか。誰でもこの問題を解決できます。前もって感謝します

私のURLは

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;");
}
4

2 に答える 2

2

このようにスタイルを設定する代わりに、以下のように設定して、ブラウザ間の完全な互換性を保つことができます。以下のように各スタイルプロパティを割り当てます。

スタイルを設定する代わりに

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..
}
于 2012-11-29T10:22:09.233 に答える
1

この質問に対する完璧な答えは

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

ブラウザがmozillafirefoxの場合、対応する属性を持つ上記のスタイルがページに適用されます。ブラウザがクロムの場合、デフォルトのスタイルが適用されます

于 2012-11-29T13:23:48.847 に答える