Передача значений массива JSON как селекторов JQuery - PullRequest
1 голос
/ 24 июля 2010

Я пытаюсь передать значения массива JSON в мой файл javascript и использовать эти значения в качестве селекторов для вызова методов соответствующих HTML-элементов div.

например:

function clickEvents(items) {
for (var r = 0; r < items.length; r++) {    
    var omega = items[r].id +;

     $(omega).click(function() {
        alert('Thanks for adding item number #' + omega ' to your cart!');
    });
}

где мой JSON выглядит так:

 {
"Items" : [{
        "header: "apple",
        "id": 5000
      }, {
         "header": "banana",
         "id":5001
      }, {
         "header": "pear",
         "id": 5002
      }]
 }

к сожалению, он не работает должным образом. Я не могу заставить селекторов совпадать. Кто-нибудь знает правильный синтаксис для этого типа подхода или есть идеи для других подходов?

когда я делаю это, это работает:

function clickEvents(items) {
   $('#5001').click(function() {
      alert('hi');
   });
 }

Ответы [ 3 ]

2 голосов
/ 24 июля 2010

Две вещи.

Во-первых, вы не можете начать идентификацию с номера. http://www.w3.org/TR/html4/types.html#type-id

Во-вторых, вам нужно объединить # в селекторе, если вы выбираете, используя атрибут ID.

Вот пример: http://jsfiddle.net/3BBtU/

function clickEvents(items) {
    for (var r = 0; r < items.length; r++) { 

          // removed the stray "+" at the end
        var omega = items[r].id;

            // If you wanted to add an attribute to each element, do it here.
        $('#' + omega).attr('someAttribute', 'some value');

            // Wrap handler assignment in a closure, passing "omega" in so that
            //      when it fires, it is referencing the correct value of "omega"
        (function(o) {
                 // concatenate "#" to the ID for a proper ID selector
             $('#' + o).click(function() {

                  // You were missing the second + operator in this concatenation
                alert('Thanks for adding item number #' + o + ' to your cart!');
             });
        })(omega);
    }
}

    // Modify IDs so that they do not start with a number
var obj = {
    "Items" : [{
            "header": "apple",
            "id": "d5000"
          }, {
             "header": "banana",
             "id": "d5001"
          }, {
             "header": "pear",
             "id": "d5002"
          }]
     };

    // call the clickEvents() passing in the Items from the obj variable
clickEvents(obj.Items);​

РЕДАКТИРОВАТЬ:

  • Добавлен пример
  • Исправлена ​​ошибка, когда у меня было functions вместо var.
  • Исправлена ​​еще одна проблема. Я обернул назначение обработчика в замыкание, потому что переменная omega использовалась внутри обработчика в конкатенации в .alert(), что означает, что она ссылалась на последнее обновление значения omega, когда щелчок вызывал его.
0 голосов
/ 24 июля 2010

Вы должны использовать что-то вроде: $("#"+omega).Вы спрашиваете идентификатор, не так ли ??

function clickEvents(items) {
for (var r = 0; r < items.length; r++) {    
    var omega = items[r].id;

     $("#"+omega).click(function() {
        alert('Thanks for adding item number #' + omega ' to your cart!');
    });
}

На самом деле функция $ () в этом случае, если строка является селектором validCSS.

0 голосов
/ 24 июля 2010

Что именно не так? Вам не хватает кавычки после последнего "id" в вашем образце, но, возможно, это просто опечатка ... (?)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...