Question

我有以下jquery代码

$(document).ready(function() {
//Default Action
$("#playerList").verticaltabs({speed: 500,slideShow: false,activeIndex: <?=$tab;?>});
$("#responsecontainer").load("testing.php?chat=1");
var refreshId = setInterval(function() {
  $("#responsecontainer").load('testing.php?chat=1');
}, 9000);
$("#responsecontainer2").load("testing.php?console=1");
var refreshId = setInterval(function() {
  $("#responsecontainer2").load('testing.php?console=1');
}, 9000);

$('#chat_btn').click(function(event) { 
  event.preventDefault();
  var say = jQuery('input[name="say"]').val()
 if (say) { 
  jQuery.get('testing.php?action=chatsay', { say_input: say} );
  jQuery('input[name="say"]').attr('value','')
} else {
  alert('Please enter some text');
}
});

$('#console_btn').click(function(event) { 
event.preventDefault();
var sayc = jQuery('input[name="sayc"]').val()
if (sayc) { 
  jQuery.get('testing.php?action=consolesay', { sayc_input: sayc} );
  jQuery('input[name="sayc"]').attr('value','')
} else {
  alert('Please enter some text');
}
});


$('#kick_btn').click(function(event) { 
event.preventDefault();
var player_name = jQuery('input[name="player"]').val()
if (player_name) { 
  jQuery.get('testing.php?action=kick', { player_input: player_name} );
} else {
  alert('Please enter some text');
}
});


});

示例表格

      <form id=\"kick_player\" action=\"\">
    <input type=\"hidden\" name=\"player\" value=\"$pdata[name]\">
    <input type=\"submit\" id=\"kick_btn\" value=\"Kick Player\"></form>

处理程序代码

if ($_GET['action'] == 'chatsay') {
$name = USERNAME;
$chatsay = array($_GET['say_input'],$name);
$api->call("broadcastWithName",$chatsay);
die("type: ".$_GET['type']." ".$_GET['say_input']);
}

if ($_GET['action'] == 'consolesay') {
$consolesay = "§4[§f*§4]Broadcast: §f".$_GET['sayc_input'];
$say = array($consolesay);
$api->call("broadcast",$say);
die("type: ".$_GET['type']." ".$_GET['sayc_input']);
}
if ($_GET['action'] == 'kick') {
 $kick = "kick ".$_GET['player_input'];
 $kickarray = array($kick);
 $api->call("runConsoleCommand", $kickarray);
 die("type: ".$_GET['type']." ".$_GET['player_input']);
}

当我点击按钮时，它会为初学者重新加载页面，而且不应该，它也不会处理我的处理程序代码。我一直在搞乱这个看起来好几个小时，我确信这是愚蠢的。

我要做的是让一个按钮（0个可见表单字段）触发一个事件。如果我必须将这些文件放在一个单独的文件上，我可以，但为了简单起见，我将它全部放在同一个文件中。 die命令用于停止加载文件的其余部分。我有可能忽视什么？

我添加了更多代码.. chat_btn和console_btn代码都可以正常工作，其设置相同（使用隐藏字段而不是文本字段）。我不知道为什么它不起作用的错误:(

Answer 1

使用return false event.instead of preventDefault并将其放在函数的末尾

即

$(btn).click(function(event){
    //code
    return false;
});

你可能应该在你的php中使用json_decode，因为你将json传递给php脚本，这样它就是一个数组。

Answer 2

根本没有调用您的回调，或者if条件导致错误。如果它到达if的任一分支，则不会重新加载页面，因为两个分支都以event.prevntDefault()开头。

如果您在控制台中没有看到任何错误，则可能根本没有绑定回调。在 DOM可用于操作之后，您是否使用jQuery(document).ready( ... )绑定事件处理程序？

关于风格的一些注释：

如果if的两个分支都包含相同的代码，请将该代码移出if语句：

表单元素使用.val()代替.attr('value')

当你真的想要测试真实性时，不要对""进行测试，只需测试值：

的

jQuery(document).ready(function () { jQuery('#kick_btn').click(function(event) { event.preventDefault(); var player_name = jQuery('input[name="player"]').val() if (player_name) { jQuery.get('testing.php?action=kick', { player_input: player_name} ); } else { alert('Please enter some text'); } }) });

Answer 3

我弄明白了这个问题。我有一个while循环，显然，每个btn名称和输入字段名称必须是唯一的，即使它们都在他们自己的标签中。

$("#playerList").delegate('[id^="kick_btn"]', "click", function(event) {
  // get the current player number from the id of the clicked button
  var num = this.id.replace("kick_btn", "");
  var player_name = jQuery('input[name="player' + num + '"]').val();
  jQuery.get('testing.php?action=kick', {
      player_input: player_name
  });
  jQuery('input[name="player"]').attr('value','')
  alert('Successfully kicked ' + player_name + '.');
});

jQuery get（）php按钮提交

3 个答案: