TypeError : $ (...) not a function

jQuery를 사용하여 사용자가 "delete"라고 표시된 테이블의 셀을 클릭 할 수있는 페이지를 만들었으며 해당 페이지를 삭제하라는 ajax 요청을 보냈습니다 데이터베이스의 항목을 셀의 ID를 기반으로 만든 다음 CSS를 변경하여 셀을 숨 깁니다.

jQuery 코드를 만들거나 조정하는 동안 테스트 페이지를 만들었습니다. 이 페이지는 완벽하게 작동합니다. 여기에 코드입니다.

<html> 
<head> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 

    (function($){ 
$.fn.deleterow = function(event) { 
    if (!confirm('Are you sure you want to delete this student?')) { 
     return false; 
    } 
    var id = event.target.id; 
    $.ajax({ 
      url: 'delete.php', 
      type: 'GET', 
      data: 'id=' + id, 
     }); 
    $(this).parent().css('display', 'none'); 
} 
})(jQuery); 
}); 
</script> 

</head> 


<table border="1"> 
<tr> 
<td>Cell 2, Row 2</td><td onclick="$(this).deleterow(event);" id="13376">delete</td> 
</tr> 
</table> 

<html>

지금 나는 그것을에 사용되는 거라는 실제 페이지에서 작동하도록 코드를 받고 일하고 있어요이 페이지는 사용자가 자신의 이름과 날짜를 선택할 수있는 간단한 양식을 가지고 . 이 양식은 div에 결과를 반환하는 ajax 요청을 보냅니다. 반환되는 데이터는 테이블이며 여기에서 제 기능을 작동 시키려고합니다. 이 테이블은 그것에 연결된 tablesorter 스크립트와 그것에 연결된 나의 함수를 가지고있다.

여전히 테이블러가 제대로 작동하지만 "삭제"가 포함 된 셀을 클릭해도 아무런 변화가 없습니다. FireBug를 사용하여 문제를 살펴본 결과 "TypeError : $ (...). deleterow는 함수가 아닙니다."

다음은 사용자가 양식을 제출하는 기본 코드입니다. 결과는 div에로드됩니다.

<html> 
<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type='text/javascript' src='jquery.tablesorter.js'></script> 
<script type='text/javascript'> 
$(document).ready(function() 
    { 
     $('#myTable').tablesorter(); 
    } 
); 
</script>"; 
</head> 

<body id="my-students"> 
<?php include 'header.php'; ?> 

<?php include 'nav-tutoring.php'; ?> 

<div id="content"> 
This is where you can view students whom you have assigned to tutoring. 
<p> 

You may change the way each column is sorted by clicking on the column header. 
<p> 
<b>Select your name and the date to view students you have assigned for that day.</b> 

<form> My form is here; removed to make post shorter </form> 

<script> 
$('#submit').click(function() 
{ 
    $.ajax({ 
     type: 'POST', 
     url: "mystudents.php", 
     data: $('#name').serialize(), 
     success: function(data) { 
      $("#list").empty(); 
      $('#list').append(data); 

     } 
    }); 
       return false; 
}); 
</script> 

<div id="list"></div>

다음은 양식 아래 div에 삽입 된 페이지의 코드입니다. 이것은 tablesorter가 작동하는 페이지이지만, 제 기능을 수행 할 수 없습니다. 또한이 스크립트 라이브러리를이 div가있는 기본 페이지 헤드에 포함 시켰는지 확인했습니다.

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script> 
<script type='text/javascript' src='jquery.tablesorter.js'></script> 
<script type='text/javascript'> 
$(document).ready(function() 
    { 
     $('#myTable').tablesorter(); 

(function($) { 
$.fn.deleterow = function(event) { 
    if (!confirm('Are you sure you want to delete this student?')) { 
     return false; 
    } 
    var id = event.target.id; 
    $.ajax({ 
      url: 'delete.php', 
      type: 'GET', 
      data: 'id=' + id, 
     }); 
    $(this).parent().css('display', 'none'); 
} 
})(jQuery); 

}); 
</script> 

<table id='myTable' class='tablesorter' border="1"> 
<thead><tr><th>ID Number</th><th>Last</th><th>First</th><th>Tutoring<br>Assignment</th><th>Assigning Teacher</th><th>Delete?</th></tr></thead><tbody> 

<?php 
while($row = mysql_fetch_array($data)){ 
    echo "<tr><td>".$row['id']. "</td><td>". $row['last']. "</td><td>". $row['first']."</td><td>". $row['assignment']."</td><td>". $row['assignteacher']."</td><td onclick='$(this).deleterow(event);' id='".$row['pk']."'>Delete</td></tr>"; 

} 
?> 
</tbody></table>

내가 얻는 오류를 기반으로 많은 검색을 수행했지만 문제를 해결할 수없는 것 같습니다. 어떤 도움이라도 대단히 감사하겠습니다. jQuery를 콘솔에로드 된 경우

출처

2013-04-09 Austin Dennis

확인하면 페이지로드에서 제대로 jQuery를 스크립트를 다운로드하는 경우. –

테스트 당신은 당신의 코드를 이런 식으로 포장한다

(jQuery 변수에 대한 확인) :

(function($){ 
     $(document).ready(function(){ 

      $.fn.deleterow = function(event) { 
        if (!confirm('Are you sure you want to delete this student?')) { 
         return false; 
        } 
        var id = event.target.id; 
        $.ajax({ 
         url: 'delete.php', 
         type: 'GET', 
         data: 'id=' + id, 
        }); 
        $(this).parent().css('display', 'none'); 
      } 
     }); 
})(jQuery);

를하지만, jQuery를 올바르게로드하는 경우 가장 중요한 확인하고,

그것이

출처

2013-04-09 14:49:47 fernandosavio

시도는 일반적인 자바 스크립트 함수를 다시 작성하는 데 도움 희망 ... 그것을 해결

이것에

function deleterow(id) {...}

와 PHP

echo "<tr><td>".$row['id']. "</td><td>". $row['last']. "</td><td>". $row['first']."</td><td>". $row['assignment']."</td><td>". $row['assignteacher']."</td><td onclick='deleterow(".$row['id']. ")' id='".$row['pk']."'>Delete</td></tr>";

출처

2013-04-09 14:50:29 Alex

이 때문에의에 5,:

는

<td onclick='$(this).deleterow(event);'

자바 스크립트 인해 바깥 '에 함수로 이것을 볼 수 없습니다.

는 내가하고 조언하는 것은 이것이다 :

<td class='deleterow'>

$(body).on('click', '.deleteRow', function(event) { 
    $(this).deleterow(event); 
});

출처

2013-04-09 14:50:49

당신은 가난한 방법입니다 jQuery의 투수 대신 온 클릭의를 사용하여 해당 이벤트를 바인딩 더 나을 것입니다.예 :

$('#myTable').on('click', 'td', function(e) { 
    $(this).deleterow(e); 
});

출처

2013-04-09 14:51:22

TypeError : $ (...) not a function

관련 문제