Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/374.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 当用户单击链接时,css背景图像会显示_Javascript_Css_Object_Onclick_Background Image - Fatal编程技术网

Javascript 当用户单击链接时,css背景图像会显示

Javascript 当用户单击链接时,css背景图像会显示,javascript,css,object,onclick,background-image,Javascript,Css,Object,Onclick,Background Image,我更新了我的帖子。现在它说“link未定义”“thisLink[link].scopeObject=new Image();”但该链接保留下来很重要,因为它是保存当前链接的linkObj的属性。我使用[]作为属性而不是点符号,因为它提供了循环功能 <script type="text/javascript"> window.onload = init; var linkObj = new Object(); var listItems = new Object(); functio

我更新了我的帖子。现在它说“link未定义”“thisLink[link].scopeObject=new Image();”但该链接保留下来很重要,因为它是保存当前链接的linkObj的属性。我使用[]作为属性而不是点符号,因为它提供了循环功能

<script type="text/javascript">
window.onload = init;
var linkObj = new Object();
var listItems = new Object();

function init() {
for(var i=0; i < document.links.length; i++) {
    var link = document.links[i];
    linkObj[link] = link;
    setupClick(linkObj);
}
}

function setupClick(thisLink) {
thisLink[link].scopeObject = new Image();
thisLink[link].scopeObject.src = thisLink[link].id + "Img.png";
thisLink[link].onclick = rollClick; 
}

function rollClick() {
var list = document.getElementById("target").childNodes;
for(var i=0; i < list.length; i++) {
    if(list[i].nodeName == "LI") {
        var id = list[i] + i;
        listItems[id] = id;
    }
}
for(id in listItems){
        if(listItems[id].indexOf(this[link].id) > -1) {
        listItem[id].style.backgroundImage =  this[link].scopeObject.src; 
}
}
}
</script>


<ul id="target">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>   
</div>
<div id="mainContent">
<div id="navLinks">
<ul>
    <li><a href="#" id="0">Home</a></li>
    <li><a href="#" id="1">About</a></li>
    <li><a href="#" id="2">Products</a></li>
    <li><a href="#" id="3">Contact</a></li>
</ul>   

window.onload=init;
var linkObj=新对象();
var listItems=新对象();
函数init(){
对于(var i=0;i-1){
listItem[id].style.backgroundImage=此[link].scopeObject.src;
}
}
}

我认为问题出在这一行:
var linkObj[link]=document.links[I]。您需要删除该行前面的var命令。我假设您的linkObj已经在代码中的其他地方声明过,您正在尝试向其中插入一个新值。如果没有,请张贴更完整的代码,我可以进一步研究它

--编辑如下--

那么我的陈述“我想你在别处定义了linkObj。”是不正确的。您可能需要这样做:
var linkObj=document.links[i]。var命令创建变量。一旦它们被创建,赋值就不需要var命令。您是想保留一个引用了所有链接的对象供以后使用,还是只需要使用每个链接一次?如果是前者,在init()函数之外添加以下行:
var linkObj={}

--更多编辑--

天哪。我不是100%确定你的最终目标是什么,但我认为你首先应该使用这样的方法:

<script type="text/javascript">
  window.onload = init;

  function init() {
    for (var i = 0; i < document.links.length; ++i) {
      setupClick(document.links[i]);
    }
  }

  function setupClick(thisLink) {
    thisLink.scopeObject = new Image();
    thisLink.scopeObject.src = thisLink[link].id + "Img.png";
    thisLink.onclick = rollClick; 
  }
</script>

window.onload=init;
函数init(){
对于(变量i=0;i

这将使您至少能够为document.links数组中存在的链接分配属性。rollClick函数的预期行为对我来说有点模糊,但至少在使用它开始时,您正在为页面中的链接分配属性。

删除有问题行前面的
var
。如果我删除它,它会说linkObj未定义。