Question

这是我的桌子，当然还有一些文字，我想按一下按钮就可以隐藏它，并显示一些图像。我也想在相同的按钮点击上反转动作。我怎么能这样做？

＆＃13;

<div id="aspect" style="display:yes">
    <table style="100%" id="Table">
        <tr>
            <th id="textul" > </th>
            <th id="textul4"> </th>
        </tr>
        <tr>
            <td id="testul2and3" style="vertical-align:top"> </td>
            <td style="vertical-align:top" id="textul6">
                <p> <iframe></iframe> </p>
            </td>                                         
        </tr>
    </table>
</div>

＆＃13;

Answer 1

您可以从jQuery .toggle()方法

开始

$("button").click(function(){
    $("img").toggle();
});

这将在您需要时起作用

看看这里：http://api.jquery.com/toggle/

Answer 2

请查看此代码示例。我使用过jQuery 2.1.1

＆＃13;

$(function() {
  $('#toggler').click(function() {
    $('#Table').toggle();
    $('#imageblock').toggle();
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="aspect">
<div style="display:none;" id="imageblock">
<img src="http://lorempixel.com/400/200/" />
</div>
<table id="Table">
<tr>
    <th id="textul" > </th>
    <th id="textul4"> </th>
    </tr>
    <tr>
		<td id="testul2and3" style="vertical-align:top"> </td>
  		<td style="vertical-align:top" id="textul6">
            <p> <iframe></iframe> </p> </td>                                         
  </tr>
     </table>
</div>
<button id="toggler">Toggle Image/Table</button>

＆＃13;

如何用图片替换整个表格？

2 个答案: