conflit avec autocomplete jquery mobile: this.attr $ ( « href ») est définie

StackOverflow https://stackoverflow.com/questions/4437419

Question

Lors de l'utilisation jquery ui autocomplete la version 1.8.5 avec jquery alpha mobile 2. Je reçois une erreur lorsque je clique sur un élément de la liste de saisie semi-automatique:

  

this.attr $ ( "href") est défini.

Quelqu'un sait-il une solution pour cela?

ÉDITÉ: 

<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>
Était-ce utile?

La solution

Modifiés jquery.mobile-1.0a2.js: Ajout d'une vérification pour voir si href est définie à l'intérieur du code 

  $( "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

Correction du problème.

Autres conseils

bonbons Hé, merci de me pointer dans la bonne direction.

Je trouve qu'il est préférable de remplacer le code jquery ui plutôt que de modifier le code source mobile jquery directement (pour le bien de maintenabilité). Ce qui suit remplace la méthode jquery-ui qui rend chaque élément dans la liste de saisie semi-automatique; il ajoute un attribut href avec la valeur de « # » à l'élément d'ancrage en cours de création. Cela devrait éviter l'erreur href non définie: 

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

}

$(this) pas $this.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top