使用 jQuery 选择焦点上的文本在 Firefox 中不起作用



我有以下jQuery代码,可以在Chrome中工作,但在Firefox中失败(没有错误,只是不起作用)。当我尝试使用双击鼠标选择文本框内的文本时,它没有选择文本,光标会转到文本的开头。有什么想法可以解决这个问题吗?

My jqueryandajax

$(document).ready(function () {
    $('td.edit').click(function () {
        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
        $(this).addClass('ajax');
        $(this).html('<input id="editbox"  size="' + $(this).text().length + '" type="text" value="' + $(this).text() + '">');
        $('#editbox').focus();
    });
    $('td.edit').keydown(function (event) {
        arr = $(this).attr('class').split(" ");
        if (event.which == 13) {
            $.ajax({
                type: "POST",
                url: "supplierprice/config.php",
                data: "value=" + $('.ajax input').val() + "&rowid=" + arr[2] + "&field=" + arr[1],
                success: function (data) {
                    $('.ajax').html($('.ajax input').val());
                    $('.ajax').removeClass('ajax');
                }
            });
        }
    });
    $('#editbox').live('blur', function () {
        $('.ajax').html($('.ajax input').val());
        $('.ajax').removeClass('ajax');
    });
});

我的网页

<html>
    <table id="sorting" class="tablesorter" style="width: 100px; table-layout: fixed;" >
    <thead>
    <tr>
    <th>6xxA <span>  <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 17px"></span>
    <th>6xxB <span>  <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 21px"></span>
    </th>
    <th  >10xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    <th >11xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    <th >12xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    <th >11xx <span> <img id="logo"  src="/image/Picture2.png" style="margin:-62px -21px -9px 32px"></span>
    </th>
    </tr>

    </thead>

    <tbody >
    <?php
    $dbHost = 'localhost'; // usually localhost
    $dbUsername = 'fms';
    $dbPassword = 'xxxxxxxx';
    $dbDatabase = 'fms';
    $db = mysql_connect($dbHost, $dbUsername, $dbPassword) or die ("Unable to connect to Database Server.");
    mysql_select_db ($dbDatabase, $db) or die ("Could not select database.");

    $sql = mysql_query("SELECT * FROM supplierprice");

    while($rows=mysql_fetch_array($sql))
    {
    if($alt == 1)
            {
               echo '<tr class="alt">';
               $alt = 0;
            }
            else
            {
               echo '<tr>';
               $alt = 1;
            }
    echo '  <td class="edit region '.$rows["supp_price_id"].'">'.$rows["region"].'</td>
            <td class="edit country '.$rows["supp_price_id"].'">'.$rows["country"].'</td>
            <td class="edit networkname '.$rows["supp_price_id"].'">'.$rows["networkname"].'</td>
                <td class="edit mcc '.$rows["supp_price_id"].'">'.$rows["mcc"].'</td>    
                <td class="edit mnc '.$rows["supp_price_id"].'">'.$rows["mnc"].'</td>
                <td class="edit mnp '.$rows["supp_price_id"].'">'.$rows["mnp"].'</td>
                   </tr>';

    }
    ?>

    </tbody>

    </table>
    </body>
    </html>

请尝试这可能会有所帮助

      $('td.edit').click(function(e){
var $target = $(e.target);
            if($target.is('#editbox')){
                return;
            }
                                        $('.ajax').html($('.ajax input').val());
                                        $('.ajax').removeClass('ajax');
                                        $(this).addClass('ajax');
                                        $(this).html('<input id="editbox"  size="'+$(this).text().length+'" type="text" value="' + $(this).text() + '">');
                                        $('#editbox ').focus();

                                  }


                         );

最新更新