gpt4 book ai didi

jquery - 不需要的返回空对象

转载 作者:行者123 更新时间:2023-12-01 06:49:35 25 4
gpt4 key购买 nike

在下面的代码中,我尝试(使用 Jquery)创建带有数组的对象,然后在单击链接时调用这些对象以显示在现有 DIV 中。

我基本上创建了一个 5x5 的矩阵;其中,每个“框”都包含一个链接。

我编写的当前代码返回:[object object]。 (我相信这是一个空数组。

HTML(我只显示矩阵的一行,还有四行):

<body>

<div id="container">

<div id="logo" class="center">

<img src="jeoparody.png" />

</div>

<div id="wood" class="center">

<ul id="categories">
<li>The Global Age</li>
<li>Age of Revolutions</li>
<li>Era of Global Wars</li>
<li>The Post War Period</li>
<li>Geography</li>
</ul>

<div class="clear"></div>

<hr />

<div class="clear"></div>

<ul id="rowOne" class="center">
<li><a href="#">$100</a></li>
<li><a href="#">$100</a></li>
<li><a href="#">$100</a></li>
<li><a href="#">$100</a></li>
<li><a href="#">$100</a></li>
</ul>

<div class="clear"></div>

<ul id="rowTwo" class="center">
<li><a href="#">$200</a></li>
<li><a href="#">$200</a></li>
<li><a href="#">$200</a></li>
<li><a href="#">$200</a></li>
<li><a href="#">$200</a></li>
</ul>

<div class="clear"></div>

<ul id="rowThree" class="center">
<li><a href="#">$300</a></li>
<li><a href="#">$300</a></li>
<li><a href="#">$300</a></li>
<li><a href="#">$300</a></li>
<li><a href="#">$300</a></li>
</ul>

<div class="clear"></div>

<ul id="rowFour" class="center">
<li><a href="#">$400</a></li>
<li><a href="#">$400</a></li>
<li><a href="#">$400</a></li>
<li><a href="#">$400</a></li>
<li><a href="#">$400</a></li>
</ul>

<div class="clear"></div>

<ul id="rowFive" class="center">
<li><a href="#">$500</a></li>
<li><a href="#">$500</a></li>
<li><a href="#">$500</a></li>
<li><a href="#">$500</a></li>
<li><a href="#">$500</a></li>
</ul>
</div>

<div id="footer" class="center"></div>

</div>

<div id="clueContainer" class="center"></div>

</body>

JQuery:

$(document).ready(function () {

/***The objects that I am creating with arrays***/
var columnOne = {
'$100':'On the world political map, where were some of the major states and empires located about 1500 A.D. (C.E.)?',
'$200':'What were the artistic, literary, and intellectual ideas of the Renaissance?',
'$300':'Where were the five world religions located around 1500 A.D. (C.E.)?',
'$400':'What were the regional trading patterns about 1500 A.D. (C.E.)?',
'$500':'Why were the regional trading patterns important?'
};

var columnTwo = {
'$100':'A',
'$200':'B',
'$300':'C',
'$400':'D',
'$500':'E'
};

var columnThree = {
'$100':'F',
'$200':'G',
'$300':'H',
'$400':'I',
'$500':'J'
};

var columnFour = {
'$100':'K',
'$200':'L',
'$300':'M',
'$400':'N',
'$500':'O'
};

var columnFive = {
'$100':'P',
'$200':'Q',
'$300':'R',
'$400':'S',
'$500':'T'
};

/***To call back each object when the link is clicked***/
$('li').on('click', 'a', function() {
var foo = $(this).text();
$("#clueContainer").text(columnOne, columnTwo, columnThree, columnFour, columnFive[foo]);
});

/***makes the main screen disappear and the new DIV appear***/
$("#container").click(function(){
$("#container").hide(function(){
$("#clueContainer").show(function(){
});
});

/***makes the new DIV disappear and the main screen reappear***/
$("#clueContainer").click(function(){
$("#clueContainer").hide(function(){
$("#container").show(function(){
});
});
});
});
});

有人有解决方案吗?

最佳答案

根据以下评论的进一步说明进行更新

$(document).ready(function () {

/***The objects that I am creating with arrays***/
var columnOne = {
'$100':'On the world political map, where were some of the major states and empires located about 1500 A.D. (C.E.)?',
'$200':'What were the artistic, literary, and intellectual ideas of the Renaissance?',
'$300':'Where were the five world religions located around 1500 A.D. (C.E.)?',
'$400':'What were the regional trading patterns about 1500 A.D. (C.E.)?',
'$500':'Why were the regional trading patterns important?'
};

var columnTwo = {
'$100':'A',
'$200':'B',
'$300':'C',
'$400':'D',
'$500':'E'
};

var columnThree = {
'$100':'F',
'$200':'G',
'$300':'H',
'$400':'I',
'$500':'J'
};

var columnFour = {
'$100':'K',
'$200':'L',
'$300':'M',
'$400':'N',
'$500':'O'
};
$('#rowFour').data('qstns', columnFour);

var columnFive = {
'$100':'P',
'$200':'Q',
'$300':'R',
'$400':'S',
'$500':'T'
};
$('#rowFive').data('qstns', columnFive);

/***To call back each object when the link is clicked***/
var $rows = $('#rowOne, #rowTwo, #rowThree, #rowFour, #rowFive');
var columns = [columnOne, columnTwo, columnThree, columnFour, columnFive];
$('li').on('click', 'a', function() {
var $this = $(this);

var foo = $this.text();
var qstns = columns[$this.closest('li').index()];
$("#clueContainer").text(qstns[foo]);
});

/***makes the main screen disappear and the new DIV appear***/
$("#container").click(function(){
$("#container").hide(function(){
$("#clueContainer").show(function(){
});
});
});

/***makes the new DIV disappear and the main screen reappear***/
$("#clueContainer").click(function(){
$("#clueContainer").hide(function(){
$("#container").show(function(){
});
});
});
});

演示:Fiddle

关于jquery - 不需要的返回空对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17107369/

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