Фоновое изображение CSS отображается, когда пользователь нажимает на ссылку - PullRequest
Новая
       17

Фоновое изображение CSS отображается, когда пользователь нажимает на ссылку

0 голосов
/ 05 июня 2010

Я обновил свой пост. Теперь он говорит "ссылка не определена" "thisLink [ссылка] .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>

1 Ответ

1 голос
/ 05 июня 2010

Я считаю, что проблема в этой строке: 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>

Это приведет вас к точке, в которой вы по крайней мере назначаете свойства ссылкам, которые существуют в массиве document.links. Желаемое поведение от вашей функции rollClick немного мутновато для меня, но, по крайней мере, с его помощью вы начинаете назначать свойства для ссылок на своей странице.

...