gpt4 book ai didi

javascript - 为什么内容完全出现在div之外?

转载 作者:太空宇宙 更新时间:2023-11-04 13:06:30 24 4
gpt4 key购买 nike

我使用了一个脚本 from this library显示表格。当我在简单的 body 元素中测试它时,它呈现得非常好Here is the fiddle.

但我想在以下代码中的 div 内显示表格(在 leftdiv 内),但它呈现在所有 div 的外部。 我该如何解决这个问题?

<!DOCTYPE html>

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://yui.yahooapis.com/3.17.2/build/yui/yui-min.js"></script>
</head>

<body class="yui3-skin-sam">
<div id="leftrightwrapper" style="background-color:brown; width:1180px; height:650px;"> <!-- start leftrightwrapper -->

<div id="leftwrapper" style="width:590px; float:left; background-color:grey; overflow-y:auto; height:650px;" class="yui3-skin-sam"> <!--start leftwrapper-->
<div >
<script>
YUI().use("datatable-sort", function(Y) {
var cols = [
{key:"Company", label:"Sort Column A", sortable:true},
{key:"Phone", label:"Sort Column B", sortable:true},
{key:"Contact", label:"Sort Column C", sortable:true}
],
data = [
{Company:"Company Bee", Phone:"415-555-1234", Contact:"Sally Spencer"},
{Company:"Acme Company", Phone:"650-555-4444", Contact:"John Jones"},
{Company:"Industrial Industries", Phone:"408-555-5678", Contact:"Robin Smith"}
],
table = new Y.DataTable({
columns: cols,
data : data,
summary: "Contacts list",
caption: "Table with simple column sorting"
}).render("#sort");
});
</script>
</div>

</div> <!-- end leftwrapper -->

<div id="rightwrapper" style="width:590px; float:right; background-color:pink; overflow-y:auto; height:650px;" >
<!-- contents of rightdiv -->
</div> <!-- end rightdiv -->

</div> <!-- end leftrightwrapper -->




</body>
</html>

enter image description here

最佳答案

给出想要的<div/>编号 sort

表格不会在您放置脚本的位置呈现,它将在将作为参数提供给 render 的元素中呈现。

.render("#sort");

...所以必须有一个元素匹配选择器(当前页面中没有这样的元素,所以它会被渲染到body)

当然你也可以改变render的参数至 #leftwrapper并使用当前ID

http://jsfiddle.net/9J8yy/2/

关于javascript - 为什么内容完全出现在div之外?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25100832/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com