1

メニューを読み取って表示しようとしていますが、そのコンテンツはMySQL/PHPとjQueryを介して動的に表示されます。メニュー名を取得して、ページに正しく表示しました。

  $select_service_name = "SELECT serv_name FROM services";
    $query =  $conn->query($select_service_name);

foreach ($query->fetchAll(PDO::FETCH_COLUMN) as $row) {
    echo '<li><a href="#">'. $row; '</a></li>';
 } 

しかし今、私はサービスの説明を記入したいと思います。最初に読み込まれたものを表示しますが、残りは

 display: none;

したがって、jQuery UIを使用して、ユーザーがクリックしたサービスに応じてサービスの説明を表示/非表示にすることができます。

これを達成する方法について何か提案はありますか?

ありがとうございました。

私はメニューを持っています:

ServiceName1 | ServiceName1 Description
ServiceName2 |
ServiceName3 |

など、jQuery .show().hide()を使用します。クリックされたservicename#に応じて、それぞれの説明を表示できるようにします。MySQlテーブルから読み取った説明を使用してこれを行うにはどうすればよいですか?

4

2 に答える 2

1

次のようなことを行います:PHP:

foreach ($query->fetchAll(PDO::FETCH_COLUMN) as $row) {
   echo '<li class="row"><a href="#">' . $row . '</a><span class="description">' . $description . '</span></li>';
} 

CSS:

.description{
  display: none;
}

jQuery:

$(document).ready(function() {
  $(".row a").click(function(e) {
    e.preventDefault();
    $(".description").hide();
    $(this).parent("li").find(".description").show();
   });
});

http://jsfiddle.net/jdfqS/2/

また、これにはjQueryUIは必要ありません。jQueryだけです。

于 2013-03-16T22:46:00.513 に答える
0

JSONを使用してデータをデータ属性に格納することをお勧めします。PHPでは、必要なデータをオブジェクトまたは配列に配置します。次に、json_encodeを使用してJSON文字列にフォーマットします。

<div data-example='<?php echo json_encode($data); ?>'></div>

JSON.parseまたはjQuery.parseJSONを介してデータを取得できます。

$('[data-example]').each(function() {
    var data = $(this).attr('data-example');
    if (data) { 
        data = $.parseJSON(data);
    }
    // ...
});
于 2013-03-16T23:05:38.780 に答える