jquery - захватить атрибуты данных - PullRequest
Новая
       20

jquery - захватить атрибуты данных

1 голос
/ 16 августа 2011

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

<script src="jquery.mobile/jquery.js"></script>

<div  id="groupA" data-group="A" class="preGroups">

    <div id="section-A1"  data-section="1">
    <input name="SRPR1"  type="text">
    <input name="SRPR2"  type="text">
    </div>

    <div id="section-A2"  data-section="2">
    <input name="SRPR1"  type="text">
    <input name="SRPR2"  type="text">
    </div>

    <div id="section-A3"  data-section="3">
    <input name="SRPR1"  type="text">
    <input name="SRPR2"  type="text">
    </div>

    <div id="section-A4" data-section="4">
    <input name="SRPR1"  type="text">
    <input name="SRPR2"  type="text">
    </div>
</div>

<div  id="groupB"  data-group="B" class="preGroups">

    <div id="section-B1" data-section="1">
    <input name="SRPR1"  type="text" value="1">
    <input name="SRPR2"  type="text"value="1">
    </div>

    <div id="section-B2" data-section="2">
    <input name="SRPR1"  type="text"value="1">
    <input name="SRPR2"  type="text">
    </div>

    <div id="section-B3" data-section="3">
    <input name="SRPR1"  type="text">
    <input name="SRPR2"  type="text">
    </div>
</div>

<script>    


    var currentGroup = "";
    var currentSection = "";

    // iterate through each group in groups
    groups = $('div[id^="group"]'); 
    $.each(groups, function(key, group) {
        currentGroup = group.getAttribute('group');
        // iterate through each section in group 
        sections = $(group).find('div[id^="section"]'); 
        $.each(sections, function(key, section) {
            currentSection = section.getAttribute('section');

            var inputs = $(section).find("input");
            inputs.each(function(){

                fnValidateDetails(currentGroup, currentSection, this.name, this.value)
            })
        });
    });

function fnValidateDetails(currentGroup, currentSection, theName, theValue ){

    console.log(currentGroup, currentSection, theName, theValue);

}

</script>

Ответы [ 3 ]

2 голосов
/ 16 августа 2011

Вы можете получить доступ к атрибутам данных одним из двух способов, используя jQuery: 

$('div').data('group');
$('div').attr('data-group');

$('div').data('section');
$('div').attr('data-section');

Не уверен, достаточно ли это для вас.Немного расплывчато в том, что вы подразумеваете под «захватом».

1 голос
/ 16 августа 2011

А как насчет jQuery.attr () ? 

$('#element').attr('data-blabla');
0 голосов
/ 16 августа 2011

Поскольку вы использовали data атрибуты в вашей разметке, вы можете получить к ним доступ, используя метод jQuery data. Также я кэшировал объект jquery в локальные переменные, которые используются с кратными в цикле, что поможет улучшить производительность. 

// iterate through each group in groups
    var $groups = $('div[id^="group"]'), $group, currentGroup, $sections, currentSection, $inputs; 
    $.each($groups, function(key, group) {
        $group = $(group);
        currentGroup = $group.data('group');
        // iterate through each section in group 
        $sections = $group.find('div[id^="section"]'); 
        $.each($sections, function(key, section) {
            currentSection = section.data('section');

            $inputs = $section.find("input");
            inputs.each(function(){

                fnValidateDetails(currentGroup, currentSection, this.name, this.value)
            })
        });
    })

;

...