Конфликт jquerymobile с автозаполнением: $ this.attr ("href") не определен - PullRequest
Новая
       19

Конфликт jquerymobile с автозаполнением: $ this.attr ("href") не определен

0 голосов
/ 14 декабря 2010

Когда я использую jquery ui autocomplete версии 1.8.5 с jquery mobile alpha 2. Я получаю сообщение об ошибке при нажатии элемента в списке автозаполнения:

$ this.attr ("href") не определено.

Кто-нибудь знает какое-нибудь решение для этого?

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

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.custom.css">
        <link rel="stylesheet" type="text/css" href="css/autocomplete.css">
    </head>
    <body>

        <div id="formWrap">
            <form id="messageForm" action="#">
                <fieldset>
                    <label id="toLabel">select:</label>
                    <div id="friends" class="ui-helper-clearfix">

                        <input id="to" type="text">
                    </div>

                </fieldset>
            </form>
        </div>
        <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="js/jquery.mobile-1.0a2.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script>


        <script type="text/javascript">
            $(function(){

                var availableTags = [
                        "ActionScript",
                        "AppleScript",
                        "Asp",
                        "BASIC",
                        "C",
                        "C++",
                        "Clojure",
                        "COBOL",
                        "ColdFusion",
                        "Erlang",
                        "Fortran",
                        "Groovy",
                        "Haskell",
                        "Java",
                        "JavaScript",
                        "Lisp",
                        "Perl",
                        "PHP",
                        "Python",
                        "Ruby",
                        "Scala",
                        "Scheme"
                    ];


                //attach autocomplete
                $("#to").autocomplete({             

                    source:availableTags
                    ,

                    //define select handler
                    select: function(e, ui) {
                        var contact = ui.item.value;
                        createSpan(contact);
                        $("#to").val("").css("top", 2);
                        return false;
                    }           
                });

                });

            function createSpan(contact){
                //create formatted friend               
                span = $("<span>").text(contact)            
                //add contact to contact div
                span.insertBefore("#to");
            }
        </script>

    </body>
</html>

Ответы [ 3 ]

1 голос
/ 17 декабря 2010

Модифицированный jquery.mobile-1.0a2.js: добавлена ​​проверка, чтобы увидеть, является ли href неопределенным внутри кода 

  $( "a" ).live( "click", function(event) { 
           //( START: My added code) 
            if($(this).attr( "href" )==undefined){
                //for links created for interaction - ignore
                return false;
            }
           //( END: My added code) 
   //Remaining code follows

Это исправило проблему.

1 голос
/ 08 января 2011

Эй, сладости, спасибо, что указал мне правильное направление.

Я считаю, что лучше переопределить код пользовательского интерфейса jquery, чем напрямую изменять исходный код мобильного jquery (для удобства обслуживания) Следующее переопределяет метод jquery-ui, который отображает каждый элемент в списке автозаполнения; он добавляет атрибут href со значением '#' к создаваемому элементу привязки. Это должно предотвратить неопределенную ошибку href: 

$('#to').data( "autocomplete" )._renderItem = function( ul, item ) {
return $( "<li></li>" )
    .data( "item.autocomplete", item )
    .append( $( "<a></a>" ).attr({href: '#'}).html( item.label ) )
    .appendTo( ul );

}

0 голосов
/ 15 декабря 2010

$(this) не $this.

...