О jQuery, метаданных и XHTML-совместимости - PullRequest
Новая
       14

О jQuery, метаданных и XHTML-совместимости

5 голосов
/ 19 мая 2009

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

Каково общее мнение о том, как лучше действовать в таких обстоятельствах?

Вариант 1: Кому небезразлично соответствие XHTML, оно все равно переоценено. У нас есть неподготовленные производители веб-контента, которые в любом случае могут внедрить разметку в наш сайт, поэтому строгое соблюдение XHTML станет несбыточной мечтой. Просто создайте атрибуты тегов и прочитайте их значения с помощью jQuery. 

Example:
<div class="jquery-feature-trigger" actson="targetID">Trigger</div>

Вариант 2: Используйте атрибуты, которые выглядят как HTML, но не должны использоваться для этой цели. 

Example:
<div class="jquery-feature-trigger" rel="targetID">Trigger</div>

Опция 3: Использовать пространства имен, которые ASP.NET 4.0 намеревается использовать. 

Example:
<div class="jquery-feature-trigger" custom:actson="targetID">Trigger</div>

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

Вариант 4: У сообщества Stack Overflow есть идея получше ... ???

Ответы [ 6 ]

8 голосов
/ 19 мая 2009

Вы можете исследовать плагин jQuery Metadata , который может хранить метаданные JSON в атрибуте class (или в других местах). Пример: 

<div class="jquery-feature-trigger { actson: 'targetID' }">Trigger</div>
6 голосов
/ 26 октября 2010

Я бы использовал для этого data- атрибуты , несмотря на соответствие XHTML, например: 

<div class="jquery-feature-trigger" data-actson="targetID">Trigger</div>

Это функция HTML5, но она не вызывает никаких проблем в HTML4 / XHTML, за исключением того, что они не являются допустимыми атрибутами в валидаторе ... но из-за этого никаких реальных проблем не возникает.

jQuery также добавил встроенную поддержку для них, начиная с jQuery 1.4.3 в методах .data().

1 голос
/ 19 мая 2009

Попробуйте это: 

<html>
<head>


  <script src="scripts/jquery/jquery-1.2.6.min.js" type="text/javascript"></script>
  <!--Using highlight effect to illustrate-->      
  <script src="scripts/jquery/jquery-ui-highlight.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(document).ready(function(){
      $(".jquery-feature-trigger").click(function(){
           $("#target-" + $(this).attr("id")).effect("highlight", {}, 6000);

      });
});
</script>

</head>

<body>

 <div class="jquery-feature-trigger" id="1">Trigger 1</div>
 <div class="jquery-feature-trigger" id="2">Trigger 2</div>
 <div class="jquery-feature-trigger" id="3">Trigger 3</div>
 <div class="jquery-feature-target" id="target-1">Target 1</div>
 <div class="jquery-feature-target" id="target-2">Target 2</div>
 <div class="jquery-feature-target" id="target-3">Target 3</div>   

</body>
</html>

Итак, я решил присвоить целевым элементам div идентификатор "target-x" и дать триггеру divs идентификатор "x". Таким образом, когда вы нажимаете на триггер x, это влияет на цель "target-x".

Обратите внимание на строку, которая идет 

$("#target-" + $(this).attr("id"))

в этот момент вы получаете идентификатор кликаемого div и объединяете его в "target-", и это становится идентификатором целевого div.

1 голос
/ 19 мая 2009

Есть ли способ сохранить информацию в методе данных jQuery? Сохраняет загромождение разметки

Пример см. Здесь

snipplr.com / вид / 9715 / заместитель JQuery-данных магазина /

или прямая документация

docs.jquery.com / ядро ​​/ данные # имя

Я использовал его пару раз для хранения информации о своих элементах, очень полезная функция, о которой, кажется, мало кто знает!

Извините, я не могу оставлять ссылки. Я новый пользователь: (

0 голосов
/ 19 мая 2009

Я не знаю точно, что вы делаете, но можно ли сделать триггер якорным тегом, а затем дать цели идентификатор? Как это: 

<a href="#target1">Trigger 1</a>
<div id="target1">Target 1</div>

Тогда вы можете использовать jQuery, чтобы найти идентификатор цели, посмотрев на атрибут href.

Если триггер 1 скрывает или показывает цель 1 или прокручивает ее вниз, этот метод имеет дополнительное преимущество, если он все еще что-то делает, если JavaScript отключен.

0 голосов
/ 19 мая 2009

А как насчет размещения внутри вашего div скрытых входов с соответствующими именами и идентификаторами? Таким образом, вы сохраняете XHTML прозрачным. Таким образом, вы будете использовать так: 

$( "div_name").find( "hidden_input_name").val()
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...