onClick in a for loop не стреляет

Что я имею ниже, это код из недавнего tutorial of Computer Arts magazine. То, что я пытался сделать, это реализовать функцию onClick в цикле, чтобы каждый div был доступен для кликабельности и загружал соответствующую веб-страницу.onClick in a for loop не стреляет

У меня есть массив, в настоящее время только один набор значений, но вы можете получить представление о нескольких значениях, которые похожи:

var itemsHTML = '', 
     items = [ 
     { 
      itemType:'ani', 
      itemName:'Show Reel 10-11', 
      path:'thumb_showreel.jpg', 
      urlPath:'showreel.html' 
     }];

И петля, которая принимает данные из массива (Пожалуйста, обратите внимание . из onClick - это мой вклад, все остальное из учебника:

for(var i = 0; i < items.length; i++) { 
     var type = items[i]['itemType']; 
     var name = items[i]['itemName']; 
     var path = items[i]['path']; 
     var urlPath = items[i]['urlPath']; 
     itemsHTML += " <div class=\"element " + type + "\" style=\"background-image:url('portfolio/" + type + "/" + path + "')\" onClick=\"document.location='http://www.thepapertorium.co.uk/'" + urlPath + "\">"; 
     itemsHTML += "  <div class=\"label\">"; 
     itemsHTML += "  <h1>" + name + "<\/h1>"; 
     itemsHTML += "  <\/div>"; 
     itemsHTML += " <\/div>"; 
    }

Это же onClick был взято из баннера моего заголовка в это работает правильно, поэтому я полагал, что я мог вставить его в здесь, и, естественно, объявление вот это к синтаксису, который нужен цикл for, но мне не повезло. Пожалуйста, помогите с этой простой дилеммой!

источник

2012-02-16 TheGreatBenigma

Не могли бы вы привести пример HTML после его создания? Пусть сценарий запускается, просматривает источник и редактирует вопрос, чтобы добавить то, что создает скрипт. –

Использование JS для конкатенации строк JS, встроенных в HTML? Это кошмар для отладки (как вы обнаружили). Используйте стандартную манипуляцию DOM вместо того, чтобы возиться с innerHTML. – Quentin

Ваша проблема может быть в одном ' - он должен идти до конца URL:

onClick=\"document.location='http://www.thepapertorium.co.uk/" + urlPath + "'\"

источник

2012-02-16 13:44:45 maialithar

Большое спасибо. Он работает сейчас :) – TheGreatBenigma

Если на вопрос ответили, отметьте его как таковой, пожалуйста. – maialithar

Я думаю, ваша проблема document.location вместо window.location. Но я бы не использовать JavaScript для того, вы можете использовать анкерный тег вместо:

itemsHTML += " <a class=\"element " + type + "\" style=\"display: block; background-image:url('portfolio/" + type + "/" + path + "')\" href=\"http://www.thepapertorium.co.uk/" + urlPath + "\">";

источник

2012-02-16 13:44:59 bfavaretto

document.location - это не проблема, но вы правы в том, что мне не нужен javascript, чтобы изменить местоположение. – mplungjan

спасибо @mplungjan, я не знал, что 'document.location' существует, всегда используется' windows.location' ... – bfavaretto

Feel бесплатно проголосовать за мины тоже. Я тоже хочу немного любить :) – mplungjan

Котировки вопрос - я упростил их для вас путем изменения "и"

Я также добавил; курсор: указатель и измененная document.location к window.location так, что более правильно на самом деле bfavaretto действительно права, говоря, вам не нужен JavaScript, чтобы изменить страницу -. ссылка будет даже дать вам указатель на свободный

DEMO

itemsHTML += '<div class="element ' + type + '" style="background-image:url(\'portfolio/' + type + '/' + path + '\')" onClick="window.location=\'http://www.thepapertorium.co.uk/' + urlPath + '\'">';

В следующий раз попробуйте jsfiddle.net и firebug

источник

2012-02-16 13:48:39 mplungjan

onClick in a for loop не стреляет

ответ

Смежные вопросы