Значение сгенерированного jQuery флажка в IE8 хранится как «вкл», а не фактическое значение? - PullRequest
Новая
       10

Значение сгенерированного jQuery флажка в IE8 хранится как «вкл», а не фактическое значение?

2 голосов
/ 01 ноября 2010

Следующий пример кода работает в FireFox, но IE вызывает проблемы.

Этот код по сути отображает список динамических флажков в соответствии с массивом JSON.

Когда я пытаюсь передать variblseзначение для флажков хранится как «вкл».Я заметил, что есть дополнительный атрибут, который отображается (только IE), который называется jQuery1288631121994, который хранит реальное значение.Кажется, что jquery пытается управлять состоянием флажков, но я не могу получить доступ к сохраненным значениям?

Вот мой тестовый пример: 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="js/jquery-1.4.3.min.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">


        var state = {
            Professions: [1]
        };

        $(document).ready(function () {



            var data = [{ "ID": 1, "Name": "Football" }, { "ID": 2, "Name": "Cricket" }, { "ID": 3, "Name": "Hockey"}];

            $.each(data, function () {

                var catid = this['ID'];
                var catname = this['Name'];

                var selected = $.inArray(catid, state.Professions) != -1 ? true : false;

                $("<li></li>")
                    .append(
                        $("<input></input>").attr({
                            id: 'category' + catid
                            , name: 'categories'
                            , value: catid
                            , type: 'checkbox'
                            , checked: selected
                        })
                        .click(function (event) {
                            //alert($(this)[0].value);

                        })
                    )
                    .append(
                            $(document.createElement('label')).attr({
                                'for': 'category-' + catid
                            })
                            .text(catname)
                    )
                    .append(
                        $("<div></div>").addClass("clear")
                    )
                    .appendTo("#ProfSelector ul");

            });

                        $("#btnTest").click(function () {
                alert($("#ProfSelector input:checkbox:checked").val());
            });

        });
    </script>
</head>
<body>
    <div id="ProfSelector">
        <ul>
        </ul>
    </div>
    <a href="#" id="btnTest">Test</a>
</body>
</html>

Ответы [ 3 ]

3 голосов
/ 05 октября 2012

Казалось бы, IE не нравится способ установки атрибутов флажка; если это изменяется на следующий IE, счастлив: http://jsfiddle.net/tS3cs/

$("<li></li>")
.append(
    '<input id="category'+catid+'" value="'+catid+'" type="checkbox"></input>'
)
.append(
    $(document.createElement('label')).attr({
        'for': 'category-' + catid
    })
    .text(catname)
)
.append(
    $("<div></div>").addClass("clear")
)
.appendTo("#ProfSelector ul");

$('#category'+catid).attr('checked',selected);
0 голосов
/ 01 ноября 2010

Я считаю, что функция .map может быть полезна для этого сценария.С этим использованием не нужно снимать трейлинг ",". 

$('#ProfSelector input:checkbox:checked').map(function() {
  return this.id;
  // or jquery object 
  // return $(this).val();
}).get().join(',');
0 голосов
/ 01 ноября 2010

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

При создании каждого входного элемента вместо заполнения поля значения, которое просто устанавливается на 'on' в IE при использовании jquery 1.4.Я создал val attr для каждого элемента и сохранил идентификатор категории.Затем я просто вызываю этот код при отправке, чтобы получить результаты. 

$(document).ready(function() {
        $("form").submit(function(){

            var str = "";
                $("#ProfSelector input:checkbox:checked").each(function () {
                    str += $(this).attr("val") + ",";
                });

            $("form").append( $("<input></input>").attr({ "type":"text", "name":"selectedCategories", "value":str }));
        });
    });
...