0

フォームがあり、特定の入力が入力されると、フォームの下に別のdivが表示されます。コードは次のとおりです。

<form>

<div class="fieldtitle">Full Name:* </div><input type="text" value="" name="fullname" id="fullname" />
<div class="fieldtitle">Email:* </div><input type="text" value="" name="email" id="emailfield" />
<div class="fieldtitle">Contact No:* </div><input type="text" value="" name="contact" id="contact" />

</form>

<div id="demo1" style="width:300px; display:none;"></div>

<script type="text/javascript">

$("#formarea").keyup(function(){
    if($(fullname).val() && $(emailfield).val() && $(contact).val() && $(quantity).val()) {
        $("#demo1").show();
        if($.browser.msie){
           $('#demo1').css({"visibility":"visible"});
        }
    } else {
        $("#demo1").hide();
    }

});

</script>

IEを除くすべてのブラウザで動作しています-これを解決する方法として何か提案はありますか?

4

2 に答える 2

1

IEは提案されたIDまたは名前セレクターが好きではありません。正しい方法で使用しないでください。対象とするセレクターを指定します。

例:置換

$(fullname)

$('#fullname')

等々...

ちなみに、サンプルコードにはID'formarea'のフォームは表示されません。そしてこれを取り除いてください:if($.browser.msie){...} その役に立たない。

于 2012-12-11T10:24:55.627 に答える
1

HTMLに数量フィールドがないため、Javascriptでロジックの問題が発生します。

<form>
    <div class="fieldtitle">Full Name:* </div><input type="text" value="" name="fullname" id="fullname" />
    <div class="fieldtitle">Email:* </div><input type="text" value="" name="email" id="emailfield" />
    <div class="fieldtitle">Contact No:* </div><input type="text" value="" name="contact" id="contact" />
    <div class="fieldtitle">Quantity:* </div><input type="text" value="" name="quantity" id="quantity" />
</form>

    <div id="demo1" style="width:300px; display:none;">Test</div>

Javascriptは、イベントを間違った要素にバインドします。inputsフォームの代わりにバインドする必要があります。また、各入力に渡されるセレクターは、cssidセレクターを使用する文字列リテラルである必要があります。

$("input").keyup(function(){
    if($("#fullname").val() && $("#emailfield").val() && $("#contact").val() && $("#quantity").val()) {
        $("#demo1").show();
    } else {
        $("#demo1").hide();
    }
});

IE条件付きの必要もありません。Jqueryのshow()/hide()メソッドはクロスブラウザ互換です。例: http: //jsfiddle.net/DEfVS/1/

于 2012-12-11T10:29:24.377 に答える