2016-05-27 4 views
1

Я хочу динамически изменять идентификатор элемента ul после нажатия на элемент li. Затем я передаю этот id переменной str как строку. Для примера, когда я нажимаю на Driver 2 ид ул изменения для,Как переключить идентификатор ul после нажатия на элемент li?

У меня есть что-то вроде этого "driver_id = 2?":

<ul class="drivers" id=""> 
    <li><a href="" id="?driver_id=1">Driver 1</a></li> 
    <li><a href="" id="?driver_id=2">Driver 2</a></li> 
    <li><a href="" id="?driver_id=3">Driver 3</a></li> 
</ul> 

и JQuery:

var str=$('ul.drivers').attr('id'); 
+4

Я настоятельно рекомендую вам этого не делать. Атрибуты 'id' не должны быть временными. Если вы хотите динамически идентифицировать элемент, вместо этого измените их классы. –

+3

Основываясь на том, что сказал @Rory, 'id' также должны быть уникальными - то, что вы предлагаете, будет иметь дублированный 'id'. –

+1

Согласен с @RoryMcCrossan. Но все же, если вы хотите знать, как это сделать, попробуйте этот '$ ('ul.drivers'). Attr ('id', 'my_new_id');' – nikhil

ответ

1

Использование атрибута id не является отличной идеей, поскольку они должны быть уникальными и не должны меняться во всем DOM.

Вместо этого атрибут data выглядит лучше.Вы можете установить атрибут, и получить доступ к его значение, используя что-то вроде этого:

HTML

<ul class="drivers" id="list"> 
    <li><a href="#" data-driver="?driver_id=1">Driver 1</a></li> 
    <li><a href="#" data-driver="?driver_id=2">Driver 2</a></li> 
    <li><a href="#" data-driver="?driver_id=3">Driver 3</a></li> 
</ul> 

JavaScript

$(document).ready(function() { 
    $('#list li a').on('click',function() { 
    var str = $(this).data('driver'); 
    console.log(str); 
    }) 
}) 

Здесь в примере JS Скрипки: https://jsfiddle.net/igor_9000/wh3v1wsk/

Надеюсь, что это поможет!

+0

Ты мне очень помог! У меня есть еще один вопрос. Когда я передаю данные из списка ul на этот php-скрипт, ответьте мне немного json, а затем моя структура JS рисует диаграмму. Он работает отлично. Но этот JS-скрипт имеет некоторую функцию интервала, которая должна обновлять диаграмму. Он не работает. У меня есть некоторые проблемы с передачей переменной str этой функции. Ошибка говорит, что str не определена. Вот код index.php http://pastebin.com/Zzy0YEPi – pkosmicki

+0

@pkosmicki было бы неплохо начать новый вопрос для этого. Если вы откроете новый вопрос, предоставьте [MCVE] (http://stackoverflow.com/help/mcve). Штамп не особенно полезен, поскольку он не воспроизводит проблему. Кроме того, если ответы здесь были полезны, пожалуйста, поддержите и выберите один из них как принятый ответ. –

1

как некоторые из упомянутых замечаний, это не очень хорошая идея. Атрибут id должен быть уникальным, поэтому, установив идентификатор ul на идентификатор одного из li, вы создаете на своей странице два идентификатора, которые замаскируют одну из них, если вы попытаетесь найти ее снова.

, но если вы пытаетесь изменить атрибуты с JQuery, используйте второй аргумент attr установить ATTRIB

$('ul.drivers').attr('id', value) 

, если вы хотите использовать класс вместо идентификатора, используйте jquerys addClass метод.

$('ul.drivers').addClass(value) 

хотя я бы рекомендовал использовать пользовательские данные атрибутов

$('ul.drivers').data('some-name', value) //=> set value 
$('ul.drivers').data('some-name') //=> get value 
0

Вместо того чтобы изменять идентификатор, создать атрибут данных, например: Атрибуты

<ul class="drivers" id="driverlist-1" data-active-driver-id=""> 
    <li><a href="" id="?driver_id=1">Driver 1</a></li> 
    <li><a href="" id="?driver_id=2">Driver 2</a></li> 
    <li><a href="" id="?driver_id=3">Driver 3</a></li> 
</ul> 

<ul class="drivers" id="driverlist-2" data-active-driver-id=""> 
    <li><a href="" id="?driver_id=4>Driver 4</a></li> 
    <li><a href="" id="?driver_id=5">Driver 5</a></li> 
    <li><a href="" id="?driver_id=6">Driver 6</a></li> 
</ul> 

Данные предназначены для хранения данных вам необходимо управлять по любой причине. Пожалуйста, обратитесь к this link.

Тогда вы измените его, как это, доступ к вашему ул с его идентификатором, потому что считаю, что если у вас есть два ULS каждый со своим собственным водителей, вы бы гарантировать надлежащее один будет изменен:

$('#driverlist-1').data('active-driver-id', value); // setting some value to it 
var str = $('#driverlist-1').data('active-driver-id'); // getting stored value 

где value - это идентификатор пользователя li. Я бы рекомендовал следовать этому, даже если у вас нет двух списков вообще, просто чтобы сохранить хорошие практики.

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