0

Page1 にいくつかの異なる選択肢を持つボックスがあり、この下に、選択した選択肢に基づいて外部ページ (Page2) からコンテンツ (異なる div) をロードしたい div があります。

ページ1

<select id="choose_alternative">
<option> Books </option>
<option> Paper </option>
</select>

ページ2

<div id="Book_div">Content</div>
<div id="Paper_div">Content</div>

この投稿を見つけて、コードの使用方法を理解しようとしたところ、次のようになりました。

$("#choose_alternative").change(function(){
  $("#show_alternative").load( $(Page2.html #Book_div).val() );
  $("#show_alternative").load( $(Page2.html #Paper_div).val() );
});

私が間違ったことを誰か知っていますか?

ありがとう。

4

4 に答える 4

1

私があなたの質問を正しく理解していれば、あなたがしたいことは、div の選択ロードによるものです。以下のコードを確認してください。

$("#choose_alternative").change(function(){

  var choose_alternative  = $("#choose_alternative option:selected").text();

  if(choose_alternative == 'Books'){
     $("#show_alternative").load('Page2.html #Book_div');
  }
  else if(choose_alternative == 'Paper'){
     $("#show_alternative").load('Page2.html #Paper_div');
  }

});

それ以外の場合は、コンテンツをすぐにロードできます

$("#choose_alternative").change(function(){
  $("#show_alternative").load("Page2.html #Book_div");
  $("#show_alternative").load("Page2.html #Paper_div");
});

続きを読む

于 2012-12-19T10:32:39.553 に答える
0

ドキュメントの関連部分は次のとおりです。

http://api.jquery.com/load/#loading-page-fragments

それは次のようにするように言います:

$("#choose_alternative").change(function(){
  $("#show_alternative").load("Page2.html #Book_div");
  $("#show_alternative").load("Page2.html #Paper_div");
});
于 2012-12-19T10:33:49.820 に答える
0

OK、うまくいかないので、何かが間違っています。同じページにうまく機能する他の同様のスクリプトがあるため、それは奇妙です。

于 2012-12-19T12:22:20.797 に答える
0
$(document).ready(function (){    
    $('#choose_alternative').change(function(){
        $show_alternative = $('#show_alternative');
        var selectedElement = $('#choose_alternative :selected');

        switch($(selectedElement).val())
        {
             case " Books ":
                  $show_alternative.load('Page2.html #Book_div');
                  break;
             case " Paper ":
                  $show_alternative.load('Page2.html #Paper_div');
                  break;
             default:
                  $show_alternative.html('No option selected.');
                  break;
        }
    }
}

$(document).ready( function(){...})その部分を決して忘れないでください。トリガーできるようにコードをレンダリングするものです。

于 2012-12-19T21:16:17.917 に答える