Передача параметров в функцию JQuery
Я создаю HTML с циклом, в котором есть столбец для действия. Эта колонка - это гиперссылка, которая, когда пользователь щелкает, вызывает JavaScript функция и передает параметры ...
пример:
<a href = "#" OnClick = "DoAction(1,'Jose');" > Click </a>
<a href = "#" OnClick = "DoAction(2,'Juan');" > Click </a>
<a href = "#" OnClick = "DoAction(3,'Pedro');" > Click </a>
...
<a href = "#" OnClick = "DoAction(n,'xxx');" > Click </a>
Я хочу, чтобы эта функция вызывала функцию Ajax jQuery с правильным параметры.
Любая помощь?
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 5
Использование POST
function DoAction( id, name )
{
$.ajax({
type: "POST",
url: "someurl.php",
data: "id = " + id + "&name = " + name,
success: function(msg){
alert( "Data Saved: " + msg );
}
});
}
Использование GET
function DoAction( id, name )
{
$.ajax({
type: "GET",
url: "someurl.php",
data: "id = " + id + "&name = " + name,
success: function(msg){
alert( "Data Saved: " + msg );
}
});
}
Обновлено:
Возможно, лучший способ сделать это, который работал бы (с использованием GET), если бы javascript не был включен, - это сгенерировать URL-адрес для href, а затем вместо этого использовать обработчик кликов для вызова этого URL-адреса через ajax.
<a href = "/someurl.php?id=1&name=Jose" class = "ajax-link"> Click </a>
<a href = "/someurl.php?id=2&name=Juan" class = "ajax-link"> Click </a>
<a href = "/someurl.php?id=3&name=Pedro" class = "ajax-link"> Click </a>
...
<a href = "/someurl.php?id=n&name=xxx" class = "ajax-link"> Click </a>
<script type = "text/javascript">
$(function() {
$('.ajax-link').click( function() {
$.get( $(this).attr('href'), function(msg) {
alert( "Data Saved: " + msg );
});
return false; // don't follow the link!
});
});
</script>
@Pim - обновлено, спасибо. Я все еще был новичком в jQuery, когда писал это.
Если вы хотите передать в URL более одного параметра, используйте данные в качестве данных: {id: '123', name: "MyName"}, где 123 - это значение параметра id, myName - это значение для имени параметра, value здесь может быть строкой или переменной, имеющей передаваемое значение. просто простой прием, позволяющий избежать конкатенации строк.
Этот принятый ответ выглядит превосходно для меня, но я не могу не задаться вопросом, как бы это выглядело с привязками onClick, выполненными в jQuery, а не прямо в тегах <a>? Я убежден, что jQuery также предназначен для обработки привязок событий.
@Marcus - на самом деле я бы сгенерировал URL-адрес как атрибут href. Затем я бы добавил обработчик кликов, который получает URL-адрес из элемента href привязки и публикует / получает его через ajax, возвращая false из обработчика кликов. Я могу добавить это в качестве альтернативы.
@tvanfosson Я попробовал ссылку для получения альтернативы href, которую вы опубликовали (я скопировал / вставил), но по какой-то причине эта строка -> $ .get ($ (this) .attr ('href') ничего не делает (нет предупреждение), есть идеи?
@PatricioCarvajalH. используйте отладчик браузера, чтобы узнать, не выполняется ли ваш запрос по какой-либо причине - я предполагаю, что он не возвращает действительный ответ.
Вы хотите передать параметры на другую страницу или только в функцию?
Если только функция, вам не нужно добавлять tvanfosson $ .ajax (). Вместо этого просто добавьте содержимое своей функции. Нравиться:
function DoAction (id, name ) {
// ...
// do anything you want here
alert ("id: "+id+" - name: "+name);
//...
}
Это вернет окно предупреждения со значениями идентификатора и имени.
Если вы хотите выполнить вызов ajax или простую функцию javascript, не забудьте закрыть свою функцию с помощью return false
как это:
function DoAction(id, name)
{
// your code
return false;
}
попробуйте что-нибудь вроде этого
#vote_links a перехватит все идентификаторы внутри ссылок для голосования. Div id ...
<script type = "text/javascript">
jQuery(document).ready(function() {
jQuery(\'#vote_links a\').click(function() {// alert(\'vote clicked\');
var det = jQuery(this).get(0).id.split("-");// alert(jQuery(this).get(0).id);
var votes_id = det[0];
$("#about-button").css({
opacity: 0.3
});
$("#contact-button").css({
opacity: 0.3
});
$("#page-wrap div.button").click(function(){
<script type = "text/javascript" src = "jquery.js">
</script>
<script type = "text/javascript">
function omtCallFromAjax(urlVariable)
{
alert("omt:"+urlVariable);
$("#omtDiv").load("omtt.php?"+urlVariable);
}
</script>
попробуйте, это сработает для меня
Вам не нужно ничего менять для GET, кроме изменения TYPE на GET. Строка запроса будет построена автоматически.