使用onclick运行一个函数来访问js中的对象属性答案

【问题标题】：use Onclick to run a function to access object properties in js使用onclick运行一个函数来访问js中的对象属性
【发布时间】：2016-09-08 23:03:54
【问题描述】：

我有一个脚本，可以生成一段有效的随机文本。它从数组中随机选择单词，然后创建句子并连接到一个段落中。

现在我希望能够从具有不同单词音调的不同数组中进行选择，以通过 html 文件中的列表形成段落。

我用不同的单词音调作为单独的属性制作了一个对象，它们的值是不同的数组。我通过将 object.property 传递给段落函数对此进行了测试，并且有效。所以我知道我可以使用 object.property 传递给函数。

现在，我有许多我希望能够使用的列表元素，每个元素都可以选择不同的词调来填充段落。我想使用 onclick 通过 if 语句调用列表中的函数。这应该选择对象中的哪个属性传递给段落函数。

返回的 ipsumText 应该等于两个数组中的任何一个。这虽然行不通。这应该工作吗？谁能告诉我在代码中哪里出错了。我搞不定。

<li onclick="flavourChoice(xx)”>choice one</li>
<li onclick="flavourChoice(yy)”>choice two</li>


<script>

var ipsumTextxx = [words here...]
var ipsumTextyy = [different words here...]

var ipsumTextFlavour = {
    xx: ipsumTextxx,
    yy: ipsumTextyy
}

function flavourChoice(choice) {
    if(choice === xx) {
        ipsumText = ipsumTextFlavour.xx;   
    } else {
        ipsumText = ipsumTextFlavour.yy;
    }

    return(ipsumText)
}

/* then use ipsumText to pass into the various functions that create the paragraphs */

</script>

【问题讨论】：

那没有用。我是否以正确的方式使用 return ？这是否会使结果在函数之外可用？
flavourChoice(xx) xx 是什么？
@OrkhanAlikhanov 我认为这就是我区分列表中选择的链接的方式。因此，如果我在 html 中有三个链接，xx，yy，zz，每个链接对应一个不同的数组供单词使用。
xx 是一个对象吗？它在哪里声明？
@OrkhanAlikhanov 没有。 html 中的列表是要单击的单词列表。如果我单击“选择一个”或“选择两个”，我需要能够更改函数中使用的数组。所以我认为当我调用 onclick = "flavourChoice()" 时我需要为 () 传递一些值，以便 if 语句可以运行。

标签： javascript html arrays

【解决方案1】：

<li onclick="flavourChoice(xx)”>choice one</li>

你看到角色 ” 了吗？应该是"。

<li onclick="flavourChoice(xx)">choice one</li>

如果xx 不是对象，则应将其设为字符串：

<li onclick="flavourChoice('xx')">choice one</li>

在您的函数中也将其设为字符串，然后使用 ipsumText 调用您的 generateParagraph() 函数。

function flavourChoice(choice) {
    var ipsumText = {};

    if(choice === 'xx') {
        ipsumText = ipsumTextFlavour.xx;   
    } else {
        ipsumText = ipsumTextFlavour.yy;
    }
    generateParagraphs(ipsumText);
}

【讨论】：

感谢您的反馈。我认为那个流浪“是帖子中的东西。代码具有正确的字符。这对我仍然不起作用。我返回“ipsumText”是因为我认为我需要在函数 flavorChoice 之外提供该结果
对不起，我期望的是当我单击链接时生成的段落，如果我单击具有“xx”的链接，则使用数组“ipsumTextxx”中的单词细绳。但什么也没有发生。该段落根本不生成。
你应该调用你的generateParagraph()函数
原始代码调用了 generateParagraph() 函数，它工作得很好，但那时我没有其他选项可供数组使用。我认为需要某种函数来告诉脚本使用哪个数组传递给 generateParagraph() 函数。我应该发布一个小提琴来查看整个代码吗？

【解决方案2】：

我将 html 中的链接 linst 更改为

<li onclick="flavourChoice('xx')">choice one</li>

经过更多研究，我发现我可以在 flavorChoice() 函数中更简单地访问对象属性。

function flavourChoice(choice) {
    var ipsumText = ipsumTextFlavour[choice]; 
    console.log(ipsumText);

在原始代码之后是几个函数，最后一个函数传入 ipsumText 值并更改 HTML 中的 DOM 元素。

我还在上面的函数中添加了所有这些。然后我调用了更新 DOM 的函数，这有效。我可以单击链接列表，每个链接都会更改用于生成段落的数组。

【讨论】：