jQuery: добавление двух атрибутов через .attr (); метод

105

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

Я узнал, что использование другого значения, кроме _blank, НЕ работает в мобильных браузерах для открытия новых окон / вкладок.

Например, если вам нужно открыть новое окно / вкладку:

  • Это работает во всех браузерах, даже мобильные браузеры: target="_blank".

  • Это не работает на мобильных браузерах, но это действительно работает на настольных браузерах: target="new".

-

Хотя у меня это работает, я не уверен, есть ли лучший способ сделать это, или способ, которым я его получил, правильный / единственный.

В основном я заменяю все значения атрибутов target="_new"или target="_blank"на target="nw", таким образом, открывается только одно новое окно, и в нем открываются все остальные новые окна, чтобы не перегружать пользователя несколькими окнами.

Еще я добавляю атрибут « Открывается в новом окне » title="".

Итак, я создал следующее решение:

$("a[target='_blank'], a[target='_new']").attr('target','nw').attr('title','Opens in a new window');

Обратите внимание на два .attr();метода.

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

Я пробовал, .attr('target','nw','title','Opens in a new window')но ничего не вышло.

Причина, по которой я спрашиваю, заключается в принципе DYR (Don't Repeat Yourself), поэтому, если я могу улучшить код, который у меня есть, отлично, если нет, то это то, что есть.

Спасибо.

Рикардо Зеа
источник
@zzzzBov, да, ты прав, спасибо за информацию.
Рикардо Зеа,
Я хотел установить для двух атрибутов одинаковое значение, так что жаль, что .attr('a,b','value')это не работает. Я тоже остановился .attr('a',1).attr('b',1). Менее полагаться на новые окна может быть другим подходом, однако в вашем случае, @ricardozea: P
Alastair

Ответы:

229

Должно сработать:

.attr({
    target:"nw", 
    title:"Opens in a new window",
    "data-value":"internal link" // attributes which contain dash(-) should be covered in quotes.
});

Примечание :

" При установке нескольких атрибутов заключать имена атрибутов в кавычки необязательно.

ВНИМАНИЕ : при установке атрибута class вы всегда должны использовать кавычки!

Из документации jQuery (сентябрь 2016 г.) для .attr :

Попытка изменить атрибут type для элемента ввода или кнопки, созданного с помощью document.createElement (), вызовет исключение в Internet Explorer 8 или более ранней версии.

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

var strAttribute = $(".something").attr("title");

Чтобы установить один атрибут, вы должны использовать

$(".something").attr("title","Test");

Чтобы установить несколько атрибутов, вам нужно обернуть все в {...}

$(".something").attr( { title:"Test", alt:"Test2" } );

Изменить - если вы пытаетесь получить / установить атрибут 'checked' из флажка ...

Вам нужно будет использовать prop() начиная с jQuery 1.6+

метод .prop () предоставляет способ явного извлечения значений свойств, а .attr () извлекает атрибуты.

... самое важное, что нужно помнить об атрибуте checked - то, что он не соответствует свойству checked. Атрибут фактически соответствует свойству defaultChecked и должен использоваться только для установки начального значения флажка. Значение атрибута checked не изменяется с состоянием флажка, в то время как свойство checked не изменяется.

Итак, чтобы получить проверенный статус флажка, вы должны использовать:

$('#checkbox1').prop('checked'); // Returns true/false

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

$('#checkbox1').prop('checked', true); // To check it
$('#checkbox1').prop('checked', false); // To uncheck it
Адам Томат
источник
1
Ага! Хорошо, это то, о чем я имел в виду. Спасибо за объяснение, поэтому я предпочел твой ответ Дереку. Спасибо, Адам. PS. Я приму твой ответ через 7 минут, это не дает мне принять его прямо сейчас.
Рикардо Зеа,
Исправление: вы можете изменить атрибут типа в IE, если элемент только что создан и еще не добавлен в DOM.
Акаш Кава
Чтобы установить несколько атрибутов, вам нужно заключить все в {...} ... Разве ключи не должны быть в кавычках?
Gcamara14
27

правильный способ:

.attr({target:'nw', title:'Opens in a new window'})
Дерек
источник
9

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

 $(".dropdown a").attr({
      class: "dropdown-toggle",
     'data-toggle': "dropdown",
      role: "button",
     'aria-haspopup': "true",
     'aria-expanded': "true"
});
Теджас Сони
источник
2

Что-то вроде этого:

$(myObj).attr({"data-test-1": num1, "data-test-2": num2});
Джейдип Патель
источник
1

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

Пример:

$('#objId').attr({
    target: 'nw',
    title: 'Opens in a new window'
});
javaprodigy
источник
0
Multiple Attribute

var tag = "tag name";
createNode(tag, target, attribute);

createNode: function(tag, target, attribute){
    var tag = jQuery("<" + tag + ">");
    jQuery.each(attribute, function(i,v){
        tag.attr(v);
    });
    target.append(tag);
    tag.appendTo(target);
}
var attribute = [
    {"data-level": "3"},
];
Wonbin
источник
Спасибо за ваш ответ. Не могли бы вы объяснить свой код или добавить его работающую демонстрацию или что-то в этом роде?
Рикардо