Question

我想在网址重定向之前提醒用户，我正在使用SweetAlert.js来实现这一目标。但是，我希望URL根据我的JSON数据中的信息动态更新。

如果您点击“加载列表”＆＃39;在我的JSFiddle中，它会向身体追加2个div。但是附加到＆＃39;网站的网址＆＃39;链接是一样的。它们需要根据从JSON数据中提取的每个div的标题进行更新。如果您尝试点击网站＆＃39;在两个div中，它会导致相同的URL（并且URL对于第二个div是正确的，但不是第一个div）。

请参阅我的JSFiddle中的第36行。这是我需要帮助的部分。

这是我的JS代码：

function createList() {
    for (var i = 0; i < data.myData.length; i++) {
        myData.push(data.myData[i]);
        myDataTitle = myData[i].Title;
        var list = document.createElement('div');
        list.className = 'unit';
        list.innerHTML =
            '<h2>' + myDataTitle + '</h2>' +
            '<h3>' + myData[i].Description + '</h3>' +
            '<div class="my-options">' +
            '<h4 id="url" onclick="redirectWarning();">Website</h4>'
        '</div>';
        document.body.appendChild(list);
    }
}

function redirectWarning() {
    swal({
        title: 'Redirect?',
        text: 'If you click "OK", you will be redirected.',
        type: 'warning',
        showCancelButton: true
    }, function () {
        window.open('https://www.google.co.uk/search?q=' + myDataTitle, '_blank');
    });
}

Answer 1

以下是一个工作示例：jsfiddle

您缺少的是变量myDataTitle将具有循环中最后一个元素的值。这就是为什么在click元素上你需要将标题作为参数传递给函数redirectWarning()。

另请注意，引用文字可能会有麻烦。

function createList() {
    for (var i = 0; i < data.myData.length; i++) {
        myData.push(data.myData[i]);
        myDataTitle = myData[i].Title;
        var list = document.createElement('div');
        list.className = 'unit';
        list.innerHTML =
            '<h2>' + myDataTitle + '</h2>' +
            '<h3>' + myData[i].Description + '</h3>' +
            '<div class="my-options">' +
            '<h4 id="url" onclick="redirectWarning(\''+myDataTitle+'\');">Website</h4>'
        '</div>';
        document.body.appendChild(list);
    }
}


function redirectWarning(title) {
    swal({
        title: 'Redirect?',
        text: 'If you click "OK", you will be redirected.',
        type: 'warning',
        showCancelButton: true
    }, function () {
        window.open('https://www.google.co.uk/search?q=' + title, '_blank');
    });
}

希望有所帮助

使用For循环创建Div时动态更新URL

1 个答案: