0

同様の質問を調べましたが、答えが見つかりませんでした。

私はこのHTMLを持っています：

<table>
<td>
<a href="#">click me</a>
<div class="showme"><p>test</p></div>
</td>
<td>
<a href="#">click me</a>
<div class="showme"><p>test 2</p></div>
</td>
<td>
<a href="#">click me</a>
<div class="showme"><p>test 3</p></div>
</td>
</table>

<div class="container" rel="showme"></div>

必要なもの：div.showmeを元々非表示にし、TD内のリンクをクリックすると、そのdiv.showmeがdiv.containerに読み込まれます。

私が試したこと：

jQuery(document).ready(function($) {

    $("td a").click(function() {  
        $(".showme").html($(this).attr('rel'));
    });

});
4

3 に答える 3

1

最初に「showme」を非表示にするようにcssを設定します

.showme { display:none}

そして、あなたのチップをこれに変えてください

jQuery(document).ready(function($) {

    $("td a").click(function() {  
        $(this).next().load($(this).attr('href'));
    });

});

javascriptで外部リンクを開くことはできないことを忘れないでください。これがあなたがやろうとしていることである場合は、divの代わりにiframeを使用することをお勧めします

于 2013-01-26T09:29:05.683 に答える
0

多分これはあなたが望むことをするでしょう

$(function(){
        $("table td>a").click(function(e){
            e.preventDefault();
            //get the html content
            var cont = $(this).parent().children(".showme").html();
            //add it to the desired div
            $(".container").html(cont);
        });
    });

少しCSSが必要になります

.showme{
display: none;

}

于 2013-01-26T10:11:36.330 に答える
0

HTMLに1つのdivを追加します

<table>
    <td>
        <a href="#">click me</a>
        <div class="showme">
            <p>
                test</p>
        </div>
    </td>
    <td>
        <a href="#">click me</a>
        <div class="showme">
            <p>
                test 2</p>
        </div>
    </td>
    <td>
        <a href="#">click me</a>
        <div class="showme">
            <p>
                test 3</p>
        </div>
    </td>
</table>
<div class="container"></div>

とこのようなスクリプト

 <style>
.showme { display:none}
</style>

<script type="text/javascript">
    jQuery(document).ready(function ($) {
        $("td").click(function () {
            var tow = $(this);
            tow.find('div[class="showme"]').css('display', 'block');
            $('.container').html(tow.find('div[class="showme"]'));
        });
    });
</script>
于 2013-01-26T09:42:20.490 に答える