TypeError: $ (...) not a function

Я использовал jQuery для создания страницы, на которой пользователи могут щелкнуть по ячейке в таблице, в которой говорится «удалить», и она отправит запрос ajax для удаления этого запись из базы данных на основе идентификатора ячейки, а затем она изменит 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>

Сейчас я работаю на получение кода для работы в реальной странице, что она будет использоваться в этой странице имеет короткую форму, где пользователи могут выбрать свое имя и дату , Эта форма отправляет запрос ajax, который возвращает результаты в div. Возвращаемые данные представляют собой таблицу, и именно здесь я пытаюсь заставить свою функцию работать. Эта таблица имеет прикрепленный к ней скрипт tablesorter, а также мою функцию, прикрепленную к ней.

Табличный принтер все еще работает нормально, но ничего не происходит, когда я щелкаю по ячейке с помощью «delete». Я использовал FireBug, чтобы посмотреть на проблему, и это дает мне ошибку «TypeError: $ (...). Deleterow is not a function"

Вот код главной страницы, где пользователь отправляет форму и форму где результат загружается в 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 под формой. Это страница, на которой работает табличный принтер, но я не могу заставить свою функцию работать. Я также убедился, что я включаю эти библиотеки скриптов в начало главной страницы, где находится этот 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>

Я выполнил много запросов на основе ошибки, которую я получаю, но я просто не могу решить проблему. Любая помощь будет принята с благодарностью.

источник

2013-04-09 Austin Dennis

Проверьте в консоли, если вы загружаете JQuery скрипт правильно на странице загрузки. –

Вы должны добавить атрибут 'type =" text/javascript "' в свой '

тест, если 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

Это из-за этого:

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

JavaScript не может видеть это как функции из-за ограждающих ''.

Что я советую делать это:

<td class='deleterow'>

затем

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

источник

2013-04-09 14:50:49

Вы бы лучше связывания этих событий с помощью левши JQuery, вместо того чтобы OnClick, что является плохой практикой.Например:

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

источник

2013-04-09 14:51:22

Смежные вопросы