点击行后不要刷新

时间:2016-06-01 11:07:03

标签: javascript jquery

我在这里遇到问题,在点击行以从表格行提交值后不刷新。

这是点击和提交的工作版本,但是它正在重新加载页面

Example on jsfiddle

这是我试图不重新加载,但它不起作用:

$("table").on('click','tr',function(e){
$('#img').show();
    e.preventDefault();
    var id = $(this).attr('value');
//    alert(id);
var $form = $('#leagueForm');
// set the input value
$(function () {
  $('#club2').val(id);
});
$form.submit(){
$('#js-trigger-overlay').click(function(){
        $.post("index.php",
            {club2: $('#club2').val()},
            function(data){
                $('#response').html(data);
            }
        );

    });
});
});

2 个答案:

答案 0 :(得分:1)

尝试此代码这是有效的,点击tr值后检查控制台是否发布到index.php文件..



$("table").on('click','tr',function(e){
    e.preventDefault();
    var id = $(this).attr('value');
    $('#club2').val(id);
    $.post("index.php",
            {club2: $('#club2').val()},
            function(data){
                $('#response').html(data);
            }
        );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form method="post" id="leagueForm" name="league" action="index.php?cat=goal">
<input name="club" value="0" id="club2" type="hidden"/>
<table id="example" class="table table-bordered table-hover sortable ">
                                <thead>
                                    <tr>
                                        <th class="nosort" data-sortcolumn="0" data-sortkey="0-0">Club</th>
                                        <th class="nosort" data-sortcolumn="1" data-sortkey="1-0">League</th>
                                        <th class="nosort" data-sortcolumn="2" data-sortkey="2-0">Games</th>
                                        
                                    </tr>
                                </thead>
                                <tbody>

                            <tr value="Napoli"><td data-value="Napoli">Napoli</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="4">4</td><td data-value="100%">100%</td><td data-value="1" class="sorted">1</td></tr><tr value="Juventus"><td data-value="Juventus">Juventus</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="4">4</td><td data-value="100%">100%</td><td data-value="1" class="sorted">1</td></tr><tr value="Inter"><td data-value="Inter">Inter</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="3">3</td><td data-value="75%">75%</td><td data-value="1.33" class="sorted">1.33</td></tr><tr value="Roma"><td data-value="Roma">Roma</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="3">3</td><td data-value="75%">75%</td><td data-value="1.33" class="sorted">1.33</td></tr><tr value="Empoli"><td data-value="Empoli">Empoli</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="3">3</td><td data-value="75%">75%</td><td data-value="1.33" class="sorted">1.33</td></tr><tr value="Lazio"><td data-value="Lazio">Lazio</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Palermo"><td data-value="Palermo">Palermo</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Sassuolo"><td data-value="Sassuolo">Sassuolo</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Sampdoria"><td data-value="Sampdoria">Sampdoria</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Atalanta"><td data-value="Atalanta">Atalanta</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Chievo"><td data-value="Chievo">Chievo</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Genoa"><td data-value="Genoa">Genoa</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Carpi"><td data-value="Carpi">Carpi</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Verona"><td data-value="Verona">Verona</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="2">2</td><td data-value="50%">50%</td><td data-value="2" class="sorted">2</td></tr><tr value="Fiorentina"><td data-value="Fiorentina">Fiorentina</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="1">1</td><td data-value="25%">25%</td><td data-value="4" class="sorted">4</td></tr><tr value="Torino"><td data-value="Torino">Torino</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="1">1</td><td data-value="25%">25%</td><td data-value="4" class="sorted">4</td></tr><tr value="Bologna"><td data-value="Bologna">Bologna</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="1">1</td><td data-value="25%">25%</td><td data-value="4" class="sorted">4</td></tr><tr value="Udinese"><td data-value="Udinese">Udinese</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="1">1</td><td data-value="25%">25%</td><td data-value="4" class="sorted">4</td></tr><tr value="Milan"><td data-value="Milan">Milan</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="0">0</td><td data-value="0%">0%</td><td data-value="8" class="sorted">8</td></tr><tr value="Frosinone"><td data-value="Fclub2rosinone">Frosinone</td><td data-value="Team">Team</td><td data-value="4">4</td><td data-value="0">0</td><td data-value="0%">0%</td><td data-value="8" class="sorted">8</td></tr></tbody></table>
&#13;
&#13;
&#13;

在index.php文件中使用

<?php 
if(isset($_POST['club2']))
{
   $club2 = $_POST['club2']; ///you will get your club2 value here 
   die;
}
?>

答案 1 :(得分:1)

尝试指定contentType。将$ .post替换为如下:

$.ajax({
    type: "POST",
    url: 'index.php',
    data: {club2: $('#club2').val()}, // parameters on web method must match
    contentType: "application/json; charset=utf-8", // <--important 
    success: function (data) {
        console.log(data.d);
        $('#response').html(data);
    },
    failure: function (response) {
        //handle error
    }
});