仅使用 javascript 打印关联数组元素答案

【问题标题】：print Associative array elements one by one using javascript only仅使用 javascript 打印关联数组元素
【发布时间】：2011-07-05 07:22:03
【问题描述】：

我有这个代码

<script type="text/javascript">
var slideStart = 1;
var slideCount = 4;
function callArr() {
    var arrName = {"rose":"5", "daisy":"4",
                   "orchid":"3", "sunFlower":"10",
                   "Lily":"15"};
    for (var flwr in arrName) {
        if (slideStart <= slideCount) {
            document.getElementById('test').innerHTML += flwr +
                                                         "   >>>>>>>>   " +
                                                         arrName[flwr] +
                                                         "<br />";
            slideStart++;
            break;
        }
    }
}
</script>

我想在任何事件上单独访问数组元素。有谁能帮帮我吗？？？？

【问题讨论】：

你有打印数组的代码。现在，你想知道什么？
你所说的“在任何事件上”到底是什么意思？
仅供参考，javascript 没有关联数组。你在那里工作的实际上是一个对象。将它们视为关联数组可能会产生意想不到的后果。 ajaxian.com/archives/…
此代码仅打印第一个元素...我希望所有元素在单击链接时一个一个打印...有可能吗？？
也许你应该从你的代码中删除 if ？特别是，不要在 HTML 中使用 >，除非您打算使用标签。

标签： javascript associative-array

【解决方案1】：

当然它只会打印第一个元素，因为你使用这样的条件

if (slideStart <= slideCount)

修改您的代码以遍历对象属性。可能的解决方案之一：

var slideStart = 0;
var slideCount = 4;
function callArr() {
    var arrName = {"rose":"5", "daisy":"4",
                   "orchid":"3", "sunFlower":"10",
                   "Lily":"15"};
    var i = 0;
    for (var flwr in arrName) {
        if (i == slideStart) {
            document.getElementById('test').innerHTML += flwr +
                                                         "    " +
                                                         arrName[flwr] +
                                                         "<br />";
            slideStart++;
            break;
        }

        i++;
    }
}

在这里试试：http://jsfiddle.net/2nDv8/

如您所见，它会在每次调用后打印下一个属性。

【讨论】：

【解决方案2】：

如果你提到 access anywere，你可以将它声明为 globla var:

<script type="text/javascript">
var slideStart = 1;
var slideCount = 4;
var arrName = {"rose":"5", "daisy":"4",
                   "orchid":"3", "sunFlower":"10",
                   "Lily":"15"}; //Declare var outside, so it's global
function callArr() {    
    for (var flwr in arrName) {
        if (slideStart <= slideCount) {
            document.getElementById('test').innerHTML += flwr +
                                                         "   >>>>>>>>   " +
                                                         arrName[flwr] +
                                                         "<br />";
            slideStart++;
            //break; //This prevents from showing more. Erase it
        }
    }
}
</script>

还要注意break 语句导致只显示第一个元素

希望这会有所帮助。干杯

【讨论】：

【解决方案3】：

这并不完全兼容跨浏览器，但您可以使用Object.keys(arrName)。或者，如果您真的关心跨浏览器兼容性，或者实际创建并存储一个行为相同的数组。

【讨论】：

【解决方案4】：

它只打印一次，因为您在循环中放置了 "break"。此代码将毫无问题地打印所有元素。一个问题也是由您的slideStart 和slideCount 变量引起的。如果您想打印所有元素，请将slideStart 更改为 0，以便打印所有元素，而不仅仅是其中的 4 个。希望对您有所帮助：

function callArr() {
    var arrName = {"rose":"5", "daisy":"4",
                   "orchid":"3", "sunFlower":"10",
                   "Lily":"15"};
    for (var flwr in arrName) {
        if (slideStart <= slideCount) {
            document.getElementById('test').innerHTML += flwr +
                                                         "   >>>>>>>>   " +
                                                         arrName[flwr] +
                                                         "<br />";
            slideStart++;
            //break;
        }
    }
}

【讨论】：

【解决方案5】：

这可能就是你想要的。在这里试试：http://jsfiddle.net/Hsn4c/1/

function callArr() {
    var slideStart = 0;
    var slideCount = 4;

    var arrName = {
        "rose": "5",
        "daisy": "4",
        "orchid": "3",
        "sunFlower": "10",
        "Lily": "15"
    };
    for (var flwr in arrName) {
        if (slideStart <= slideCount) {
            document.getElementById('test').innerHTML += flwr + ">>>>>" + arrName[flwr] + "<br />";
            slideStart++;
            //break;
        }
    }
    document.getElementById('test').innerHTML += '==========<br />';
}

【讨论】：

感谢 4 的回复....它现在正在一次打印所有值...我希望当我点击一个链接时，第一个元素被打印出来。然后在第二次点击时，第二个元素等等......