Question

我正在尝试根据切换开关编辑我主页上的div类名，但切换开关位于不同的页面上。当div在同一页面上但现在它不起作用时，这个脚本有效。

function changeStatus(obj,temp) {
var toggleid = $(obj).attr('name');
var toggle = document.getElementsByClassName("statusinput")[toggleid];
var statusEffect = $.get('index.html', null, function(text){
                         alert($(text).find('#name'));
                         });
if(toggle.checked){
    statusEffect.innerHTML = "Arrived";
    statusEffect.classList.remove("statusp");
    statusEffect.classList.add("statusa");
}else{
    statusEffect.innerHTML = "Pending";
    statusEffect.classList.remove("statusa");
    statusEffect.classList.add("statusp");
}

每次运行时我都会收到错误[Object object]。这应该是这样的，当用户检查框时，div从“待定”切换到“到达”

Answer 1

您只能修改当前加载的页面的DOM。如果要根据另一个页面中的操作更改其他页面，则需要保留用户交互的状态，然后在加载时修改其他页面。为此，您可以使用localStorage，sessionStorage，session，cookies或AJAX在服务器上存储信息

Answer 2

取决于您的JQuery版本：

var statusEffect = $.get('index.html', null, function(text){
                         alert($(text).find('#name'));
                         });

$。get（）将返回一个promise，而不是一个DOM元素。 Link to docs

再往下，你试图像DOM元素一样使用它。

if(toggle.checked){
    statusEffect.innerHTML = "Arrived";
    statusEffect.classList.remove("statusp");
    statusEffect.classList.add("statusa");
}else{
    statusEffect.innerHTML = "Pending";
    statusEffect.classList.remove("statusa");
    statusEffect.classList.add("statusp");
}

如果您希望在其他页面上更改div的类名，则必须在某处存储该信息，例如cookie。当该页面加载时，检查cookie以给div提供正确的类名。

从其他页面编辑div内容

2 个答案: