Предоставление собственных атрибутов гиперссылок

Question

Я хотел бы указать все атрибуты моего URL. На каждой странице, вероятно, около 400. Иногда только 40, только в зависимости от того, какой тип продукта просматривается.

Я хотел бы что-то вроде этого:

<a href="link.html" class="something" title="Click here to add this to your cart" partno="DBF-XJ3" qtyType="Box QTY" quantity="50">Stainless Steel Bolts</a> 

Как это может быть сделано?

Я знаю, что в HTML5 есть какая-то вещь, но я пока не могу ее найти, поэтому, возможно, я что-то неправильно понял.

В принципе, при нажатии любой из этих ссылок я (PHP) вставляю этот продукт в свою корзину покупок в базе данных. Но, основываясь на атрибутах любой ссылки, мне может потребоваться выполнить некоторые вычисления/настройки/etc, прежде чем вставлять их в БД.

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

Answer 1

Вы бы сделать это следующим образом:

$(document).ready(function(){ 
    $("a[href]").each(function(){ 
    if($(this).attr("href") == "link.html"){ //I put a condition here just in case you need one 
     $(this).attr({ 
     "partno": "DBF-XJ3", 
     "qtyType": "Box QTY", 
     "quantity": "50" 
     }); 
    } 
    }); 
}); 

Если все ваши ссылки нужны те же атрибуты, вы можете удалить условие.

Надеюсь, это поможет. Cheers

PS: Он будет работать в каждом браузере, однако HTML5 рекомендует добавлять префикс 'data-' к вашим пользовательским атрибутам. Пример data-partno="DBF-XJ3"

Answer 2

Вы правы, это атрибут data-, который вы ищете. [random reference]

Ваша ссылка будет выглядеть примерно так:

<a data-partno="DBF-XJ3" data-qtyType="Box QTY" data-quantity="50"> 

Demo здесь: http://jsfiddle.net/wesley_murch/ey2pg/

Это действительно просто Javascript крюк, и так как JQuery, кажется, справиться с этим хорошо во всех браузерах я проверил (в том числе IE6), я бы сказал, что его «безопасно» использовать. Насколько я знаю, вы даже можете создавать атрибуты, и он будет работать с jQuery (хотя это не рекомендуется). Это действительно лучший способ избежать злоупотребления rel и title и таких (как это делают многие люди), только для взаимодействия с JavaScript.

Тем не менее: я бы предложил использовать <form> со скрытыми <input> s (и <button> для легкого укладки), чтобы представить значения. Другой способ разбит без javascript, после этого вы можете улучшить его с помощью jQuery.