Несколько кнопок пользовательского интерфейса jQuery с одинаковым идентификатором - PullRequest
Новая
       15

Несколько кнопок пользовательского интерфейса jQuery с одинаковым идентификатором

0 голосов
/ 17 марта 2010

Возможно, решение этого вопроса действительно простое, но я его просто не вижу!

У меня есть страница со списком товаров. каждый элемент имеет одну и ту же кнопку jquery ui (находится внутри диалога и добавляет этот элемент в список). Я идентифицирую предмет через родительский DIV, содержащий идентификатор БД. Пока все хорошо ...

Проблема только в том, что первая кнопка в списке работает! Вторая, третья и т. Д. Кнопки вообще не показывают никакой реакции. Все кнопки имеют одинаковый идентификатор - список динамический, и при каждом щелчке запускается одно и то же действие. Изменяется только родительский идентификатор.

Вот часть дисплея: 

<div id="2">
  <div id="56">
    <button id="add-audio-file" class="ui-button ui-state-default ui-corner-all">betty_2.mp3</button>
  </div>
</div>

<div id="2">
  <div id="57">
    <button id="add-audio-file" class="ui-button ui-state-default ui-corner-all">betty_3.mp3</button>
  </div>
</div>

И вот идет Часть JS: 

    $('#add-audio-file').click(function() {
        assetID = $(this).parent('div').attr('id');
        pageID = $(this).parent('div').parent('div').attr('id');
        $.post(
            "modules/portfolio/serialize.php", 
            {id : pageID, assetid : assetID, do : "add-audio-file"},
                function(data, textStatus, xhr) {
                    $('#dialog-add-audio').dialog('close');
                }
        );

    });

Я использую jquery 1.4.2 и jquery ui 1.8rc3 Есть идеи?

Ответы [ 3 ]

9 голосов
/ 17 марта 2010

Все кнопки имеют одинаковый идентификатор

id - идентификатор элемента, вы не можете установить его для более чем одного элемента. Попробуйте вместо этого дать вашим кнопкам class и посмотрите, сработает ли это после этого.

2 голосов
/ 17 марта 2010

Не являются ли дублирующие идентификаторы в документе плохой практикой?

0 голосов
/ 18 октября 2013

Это будет работать, когда вы поместите элемент кнопки

в html: 

<input type="button" value="MyButton1" /> 
<input type="button" value="MyButton2" />
...
<input type="button" value="MyButtonN" />

в javascript из jquery-ui: 

search for: $("#button").button(); 
then replace or add    $('[type="button"]').button();"

ex 

$("#button").button();
$('[type="button"]').button();
...