0

我知道这里有人问过这个问题：Clicking a div changes another div's content

但我仍然在我的页面上“转换”这个概念时遇到问题。

我目前有 2 个 DIV 元素，一个 ID 为“content”，另一个 DIV 名为“html”

基本上我想更改DIV“内容”的内容 - 单击DIV“html”时。将来我还会添加其他 3 个 div，因此我还需要知道如何将相同的东西应用于其他 div。我知道这是一个多余的问题，但这是我第一次尝试 JQuery，我想了解我在做什么而不是复制和粘贴，并希望在我真的不知道时进行修改。当我可以学会钓鱼时，我不想被交给鱼。先谢谢了。

4

2 回答 2

3 
<div id="footer">
        <div id="html">
           HTML DIV
        </div>
       <div id="content">
         <p>Please select a topic below.</p>
       </div>
</div>

$(document).ready(function(){  /// when document is loaded execute this function
    $("#html").click(function(){ //when element with id 'html' is click execute function  
       $("#content").html("NEW Text"); // replace contents of element with id 'content'  
     } );
});

$("#html") 等同于包裹在 JQuery 中的 document.getElementById("html")。

$("#html").click(); 触发程序化点击事件 :)

$("#html").click(function(){alert("here");}); //注册当id为'HTML'的元素被点击时需要执行的函数

$("#content").html(); // 返回内部 HTML

$("#content").html("NEW");// 改变innerHTML

现场演示

于 2013-05-21T18:03:19.903 回答
0

当您希望单击某个 div 后发生某些事情时，您将需要注册一个事件处理程序。这就是这一行发生的事情：

 $('#html').on('click', function(){});

这里的函数是事件处理程序。每当您单击带有 id 的 div 时，html都会执行该函数。
所以在这个函数中你可以改变其他 div 的内容：

 $('#content').html('New text for old div.');

如果你把它放到你的函数中，那么当你点击 html 时，内容的文本将会改变。

于 2013-05-21T17:58:20.380 回答