0

簡単に言えば、ドロップダウンで選択した内容に基づいて、div の css 表示状態を変更したいと考えています。つまり、ドロップダウンで項目を選択すると、div の cssdisplayプロパティが からnoneに変更されblockます。

私のCSS

<style>
  .lp_claims, .gap_claims, .home_claims, .motor_claims{ display:none;}
</style>

HTML

<select name="claimsform">
<option value="lp_claims"> Loan Protection </option>
 <option value="gap_claims"> GAP or Cash Assist </option>
 <option value="home_claims"> Home </option>
 <option value="land_claims"> Landlords </option>
<option value="motor_claims"> Car </option>
</select> 

<div class="lp_claims">
<p> <strong>Loan </strong><br>
Contact  us  </p>
</div>

<div class="gap_claims">
<p> <strong>GAP or Cash Assist </strong><br>
Contact  us  </p></div>

<div class="home_claims">
<p><strong>Home </strong><br>
Contact  us  .</p>
</div>

<div class="motor_claims">
<p><strong>Motor</strong><br>
Contact  us .</p>
</div>

とJquery

<script type="text/javascript">
$(document).ready(function(){
$('select').on('change', function(){
var val = $(this).val();
$('div').hide();
$('.' + val).css('display','block'); }).change();
});
</script>

これがフィドルです：http://jsfiddle.net/En4Ka/

OK NOW すべて正常に動作します。そして私の質問は：なぜこれが私のHTMLファイルで機能しないのですか：http://fitfixtraining.com.au/test/index.html

4

4 に答える 4

3

（ahren [+1]が言ったように）コードに不正な文字が含まれているため、コンソールのエラーを確認してください。

これは通常、jsfiddleからパスタコードをコピーするときに発生します。

これがNotepad++のスクリーンショットです。ここでハイライトします。

ここに画像の説明を入力してください

編集：これらの厄介な目に見えない空白を取り除くために簡単なJSをコーディングしただけで、ここで試すことができます。

于 2012-10-02T01:30:14.310 に答える
1

JSFiddleからコピーして貼り付けると、不正な余分な文字をコピーしてエラーをスローします。

あなたはあなたのindex.htmlの49行目にあります。

$('select').on('change', function(){
    var val = $(this).val();
    $('div').hide();
    $('.' + val).css('display','block');
}).change();​
//Uncaught SyntaxError: Unexpected token ILLEGAL

また、PhillipKreggが指摘したように、構文エラーがあります。詳細については、彼の回答を参照してください。

于 2012-10-02T01:25:10.863 に答える
1

この行を参照してください：

 $('.' + val).css('display','block'); }).change();​

余分な中括弧を取り除く-}

于 2012-10-02T01:25:16.557 に答える
0

JavaScriptを正しく閉じなかったため、無効であり、読み込まれていません。

選択機能とドキュメント準備機能を閉じる必要があります。

于 2012-10-02T01:27:45.200 に答える