次のシナリオでjQueryエラー "TypeError：$（...）。liveは関数ではありません"が表示されるのはなぜですか？

Question

実際には、1つのテキストフィールドにオートコンプリート機能を実装しようとしていますが、上記のエラーが表示されて、なぜこのエラーが発生しているのか理解できませんでした。このエラーを解決するのに手伝ってもらえますか？

<link rel="stylesheet" type="text/css" href="{$control_css_url}ui-lightness/jquery-ui-1.10.3.custom.css"> 
<link rel="stylesheet" type="text/css" href="{$control_css_url}autocomplete.css"> 
<label>Name</label> 
      <div class="form-element" id="friends"> 
       <input type="text" class="" name="user_name" id="user_name" value="{$user_name}" /> 
      </div> 

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

    var class_id = $('#class_id').val(); 
    var section_id = $('#section_id').val(); 

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

      //define callback to format results 
      source: function(req, add){ 

       //pass request to server 
       $.getJSON("report_student_result.php?callback=?op=get_student_names&class_id="+class_id+"&section_id="+section_id, req, function(data) { 

        //create array for response objects 
        var suggestions = []; 

        //process response 
        $.each(data, function(i, val){         
        suggestions.push(val.name); 
       }); 

       //pass array to callback 
       add(suggestions); 
      }); 
     }, 

     //define select handler 
     select: function(e, ui) { 

      //create formatted friend 
      var friend = ui.item.value, 
       span = $("<span>").text(friend), 
       a = $("<a>").addClass("remove").attr({ 
        href: "javascript:", 
        title: "Remove " + friend 
       }).text("x").appendTo(span); 

       //add friend to friend div 
       span.insertBefore("#user_name"); 
      }, 

      //define select handler 
      change: function() { 

       //prevent 'to' field being updated and correct position 
       $("#user_name").val("").css("top", 2); 
      } 
     }); 
     //add click handler to friends div 
     $("#friends").click(function(){ 

      //focus 'to' field 
      $("#user_name").focus(); 
     }); 

     //add live handler for clicks on remove links 
     $(".remove", document.getElementById("friends")).live("click", function(){ 

      //remove current friend 
      $(this).parent().remove(); 

      //correct 'to' field position 
      if($("#friends span").length === 0) { 
       $("#user_name").css("top", 0); 
      }     
     });      
    }); 

</script> 

は、このエラーを解決するために私を助けてください

レポート-学生result.tpl：あなたの参考のために、私は、以下のすべての必要なコードを提供しています。前もって感謝します。

Answer 1

live()は、バージョン1.9以降に削除されていて、1.7以降廃止されました：

あなたはon()今日#friendsの準備ができてDOMで提供されています

$('#friends').on("click", ".remove", document.getElementById("friends"), function(){ 

を望むことでしょう。ダイナミックロードされた要素にon()をバインドすることはできません。

Answer 2

Live（）はjqueryから1.9から削除されました。

$(document).on('event', 'selector', function() {});が.live()を置き換えるあなたは（jQueryの1.7の後に廃止予定）.on()の代わり.live()を使用することができますon

Answer 3

を使用してください。

例：

$(document).on("click", "#elementId ", function(){ alert("Do here what you want!"); // jQuery1.7+ });