2

これが私が求めているものです。

「moreInfo」という名前の div 内の現在の段落を置き換えるには、各 LI が必要です。

これまでのところ、各 li に ID を与えようとしましたが、追加の各段落は何も表示しないように設定されています。デフォルトの段落を設定し、タブ (LI) をクリックする前にそれを表示しました。

<ul class="sideLinks">

    <li id="sideLink1">
        <a href="" >Favorites</a>
    </li>

    <li id="sideLink2">
        <a href="">Scope</a>
    </li>

    <li id="sideLink3">
        <a href="">Concierge</a>
    </li>

    <li id="sideLink4">
        <a href="">Share</a>
    </li>

    <li id="sideLink5">
        <a href=""> Reminders</a>
    </li>
</ul>

これは私がこれまでに jQuery 用にセットアップしたものですが、奇妙な理由で最初のリンクでエラーが発生します。

$(document).ready(function(){
    $('li#sideLink1').click(function () {
        event.preventDefault();
        $('#moreinfo').html($("p#favorites"));
    });
});

どんな助けでも大歓迎です！ありがとう！

4

5 に答える 5

1

You don't define event. Rewrite as:

$("#sideLink1").click(function (event) { ...

Also note that you don't need the element name as part of the selector if you are using an ID. It may even slow the selector down.

于 2012-12-06T16:12:10.013 に答える
0

イベントの引数がありませんでしたが、それで問題が完全に解決するとは思いません。これは、完全なマークアップと、あなたが達成しようとしていると私が信じていることの例です。

http://jsfiddle.net/psyon001/zjQy7/

私はアンカーを使用したので、jsが無効になっている場合は、no-jsクラス定義を表示ブロックに追加すると、リンクがテキストにアンカーされ、テキストがより適切に機能しなくなります。

<style>
    #moreInfo p{display:none;}
    #moreInfo p#default{display:block;}
</style>

-

<ul class="sideLinks">
    <li>
        <a href="#favoritesDetail">Favorites</a>
    </li>
    <li>
        <a href="#scopeDetail">Scope</a>
    </li>
    <li>
        <a href="#conciergeDetail">Concierge</a>
    </li>
    <li>
        <a href="#shareDetail">Share</a>
    </li>
    <li>
        <a href="#remindersDetail">Reminders</a>
    </li>
</ul>
<div id="moreInfo">
    <p id="default"></p>
    <p id="favoritesDetail">Favorites description...</p>
    <p id="scopeDetail">Scope description...</p>
    <p id="conciergeDetail">Concierge description...</p>
    <p id="shareDetail">Share description...</p>
    <p id="remindersDetail">Reminders description...</p>
</div>

-

<script>
$('.sideLinks').find('a').on('click', function(e){
    e.preventDefault();
    var $moreInfo = $('#moreInfo'),
        id = $(this).attr('href');
    $moreInfo.find('p').hide();
    $moreInfo.find(id).show();
});​
</script>
于 2012-12-06T16:35:48.797 に答える
0

Missing argument. You need to pass the event in the function

$('li#sideLink1').click(
    function (event) {
    event.preventDefault();
    $('#moreinfo').html($("p#favorites"));

});
于 2012-12-06T16:13:00.660 に答える
0 
jQuery(function($){
    $('li#sideLink1').click(function (event) {
        event.preventDefault();
        $('#moreinfo').html($("p#favorites").html());
    });
});

.html()jQuery オブジェクトではなく、文字列を引数として受け入れます。

于 2012-12-06T16:13:19.840 に答える
0

発生しているエラーは、イベント オブジェクトを無名関数に渡していないことが原因である可能性があります。

$('li#sideLink1').click(
    function(event) {
        event.preventDefault();
        $('#moreinfo').html($("p#favorites"));
    }
);

つまり、LI タグには防止する既定のアクションがなく、提供されたコードが与えられた場合、アンカー タグには引き続き既定のアクションがあります。代わりにアンカー タグにクリック アクションを配置することもできます。

于 2012-12-06T16:22:25.117 に答える