Jquery 在javascript/php中移动单引号

您好，我正在尝试在html表上创建动态过滤器，它通常可以正常工作，但我无法在字符串中移动单引号，我在php中尝试了addslashes（），在javascript中尝试了regex replace（），但没有任何效果…我不知道是否必须更改过滤器逻辑 这是全部javascript代码，但我认为问题出在selectField change函数中：

$(document).ready(function(){ 
function addRemoveClass(theRows){

    theRows.removeClass("odd even");
    theRows.filter(":odd").addClass("odd");
    theRows.filter(":even").addClass("even");

}   

var selVal='';

var rows=$('#myTable tbody tr');

addRemoveClass(rows);


$("#selectField").on("change",function() {
    $('table').show();
    var selection = $(this).val();
    var dataset = $('#myTable tbody').find('tr');
    dataset.show();
    // filter the rows that should be hidden
    if(selection!="All"){
        //selection=selection.replace(/'/g, '"');
        selection = selection.replace(/'/g, "\\'");
        if(selVal==="First_Name"){
            dataset.filter(function(index, item) {
            //return $(item).find('td:nth-child(1)').text().split(',').indexOf(selection) === -1;
            return $(item).find('td:nth-child(1)').text().indexOf(selection) === -1;
            }).hide();
        } else if(selVal==="Surname"){
            dataset.filter(function(index, item) {  
            return $(item).find('td:nth-child(2)').text().indexOf(selection)=== -1;
            }).hide();
        }
        else if(selVal==="Address"){
            dataset.filter(function(index, item) {
            return $(item).find('td:nth-child(3)').text().indexOf(selection) === -1;
            }).hide();
        }else{
            dataset.show();
        }
    } else{
        dataset.show();     
    }
});



$("#selectCat").on("change",function(){
    var e = document.getElementById("selectCat");
    var strUser = e.options[e.selectedIndex].value;
    selVal=strUser;
    $("#selectField").empty();
    //$("#mytBody tr").empty();
    var selected = this.value;
    if(selected !="NoCategory"){
        $.post('process.php', {category:this.value}, function(data) {
                data = $.parseJSON(data);

                    var al='All'
                    var options = "";
                        options += "<option value=All selected>All</option>";
                $("#selectField").append(options);

                    options = "";
                    for (var i = 0; i < data.length; i++) {                         
                        //data[i] = data[i].replace(/'/g, "\\'");
                        options += "<option value='" + data[i] + "'>" + data[i] + "</option>";
                        //options += "<option value='" + data[i].toLowercase() + "'>" + data[i] + "</option>";
                    }
                $("#selectField").append(options);
            return false; //prevent from reloading the page
        });

    }else{
        rows.show();
        addRemoveClass(rows);
    }

});
});

$（文档）.ready（函数（）{
函数addRemoveClass（theRows）{
theRows.removeClass（“奇偶”）；
theRows.filter（“：odd”）.addClass（“odd”）；
theRows.filter（“：偶数”）.addClass（“偶数”）；
}   
var selVal=''；
变量行=$（“#myTable tbody tr”）；
addRemoveClass（行）；
$（“#selectField”）。在（“change”，function（）上{
$（'table'）.show（）；
var selection=$（this.val（）；
变量数据集=$（'#myTable tbody'）。查找（'tr'）；
dataset.show（）；
//筛选应隐藏的行
如果（选择！=“全部”）{
//selection=selection.replace（/“/g，”）；
选择=选择。替换（/'/g，\\''）；
如果（selVal==“名字”）{
dataset.filter（函数（索引，项）{
//return$（item）.find（'td:nth child（1）'）.text（）.split（'，'）.indexOf（selection）=-1；
return$（item）.find（'td:nth child（1）'）.text（）.indexOf（selection）=-1；
}).hide（）；
}else if（selVal==“姓氏”）{
dataset.filter（函数（索引，项）{
return$（item）.find（'td:nth child（2）'）.text（）.indexOf（selection）=-1；
}).hide（）；
}
else if（selVal==“地址”）{
dataset.filter（函数（索引，项）{
return$（item）.find（'td:nth child（3）'）.text（）.indexOf（selection）=-1；
}).hide（）；
}否则{
dataset.show（）；
}
}否则{
dataset.show（）；
}
});
$（“#selectCat”）。在（“更改”，函数（）上{
var e=document.getElementById（“selectCat”）；
var strUser=e.options[e.selectedIndex].value；
selVal=strUser；
$（“#选择字段”）.empty（）；
//$（“#mytBody tr”）.empty（）；
所选var=此值；
如果（选中！=“无类别”）{
$.post（'process.php'，{category:this.value}，函数（数据）{
data=$.parseJSON（数据）；
var al='All'
var期权=”；
选项+=“全部”；
$（“#选择字段”）。附加（选项）；
选项=”；
对于（var i=0；i

下面是我正在使用的html文件中的代码：

<head>
<meta charset="UTF-8">
<script type="text/javascript" src="jquery-3.1.0.js"></script>
<script type="text/javascript" src="filter.js"></script>
<link rel="stylesheet" type="text/css" href="resultdiffversion.css" />
<link rel="stylesheet" type="text/php" href="process.php" />
<title> Import data </title>
</head>

<body>
</body>

                    <div class="optionDiv">
                    Filter by Category
                    <select id="selectCat">
                        <option value="NoCategory" selected>NoCategory</option>
                        <option value="First_Name">First_Name</option>
                        <option value="Surname">Surname</option>
                        <option value="Address">Address</option>
                    </select>

                    Filter by Selected Category
                        <select id="selectField">
                            <option value="All" selected>All</option>   

                    </select>
                </div>  
                <table id="myTable">

                    <thead> 
                    <tr id=HeadRow><th>First_Name</th><th>Surname</th><th>Address</th><th>ID</th></tr>                      
                    </thead>  
                <!--    
                    <tr id="HeadRow">  
                        <th>ID</th>
                        <th>First_Name</th>
                        <th>Surname</th>
                        <th>Address</th> 
                    </tr>
                --> 
                    <tbody> 

                    <tr><td>Michael</td><td>O'Reilly</td><td>581 Beech Street, Lincoln, NE 68506</td><td>246</td></tr><tr><td>Della</td><td>Austin'</td><td>376 Washington Street, Pompano Beach, FL 33060</td><td>247</td></tr><tr><td>Hector</td><td>Hopkins</td><td>442 College Street, East Brunswick, NJ 08816</td><td>248</td></tr><tr><td>Terrance</td><td>Garza'</td><td>737 Route 1, Mahwah, NJ 07430</td><td>249</td></tr><tr><td>Melvin</td><td>Boyd'</td><td>525 Olive Street, Derby, KS 67037</td><td>250</td></tr><tr><td>Kimberly</td><td>Alvarez'</td><td>269 Olive Street, Redondo Beach, CA 90278</td><td>251</td></tr><tr><td>Eleanor</td><td>Steele'</td><td>447 Canal Street, Goose Creek, SC 29445 </td><td>252</td></tr><tr><td>Elsa</td><td>Osborne'</td><td>894 Pheasant Run, Pottstown, PA 19464</td><td>253</td></tr><tr><td>Cameron</td><td>Huff'</td><td>416 Parker Street, Riverdale, GA 30274</td><td>254</td></tr><tr><td>Essie</td><td>Ray'</td><td>539 Devon Court, Woodhaven, NY 11421</td><td>255</td></tr><tr><td>I'Am</td><td>TheBest</td><td>MyStreet 75</td><td>256</td></tr><tr><td>Bilbo</td><td>Baggins</td><td>Shire</td><td>257</td></tr><tr><td>Larry</td><td>I'Connol</td><td>Larrys's Street 45</td><td>258</td></tr><tr><td>Martin</td><td>O'Bannon</td><td>Martins's Street, 56</td><td>259</td></tr>

导入数据
按类别筛选
无类别
名字
姓
地址
按所选类别筛选
全部的
第一个\u名称URNAMEAddressId
MichaelO'Reilly 581 Beech Street，Lincoln，NE 68506246 Dellaaustin'376华盛顿街，蓬帕诺海滩，佛罗里达州33060247 HectorHopkins442学院街，东不伦瑞克，新泽西州08816248TerranceGarza'737路线1，马沃，新泽西州07430249梅尔文博伊德'525橄榄街，德比，堪萨斯州67037250金伯利亚尔瓦雷斯'269橄榄街，加利福尼亚州雷东多海滩，加利福尼亚州90278251Eleanore Steel'447卡纳19464253加利福尼亚州波茨敦艾尔索斯伯恩894野鸡赛跑19464253加利福尼亚州里弗代尔帕克街卡梅隆哈夫416号新泽西州伍德黑文德文法院l街邮编：30274254EssieRay'539 Devon Court，Woodhaven，NY 11421255I'amBestMystreet 75256 Bilbobagginshire257Larry'ConnolLarrys街45258马丁诺班农马丁斯街，56259

这是我尝试用单引号过滤名称时得到的结果

---

O'Reilly上的filter接受名称以“O”开头的所有人，因为名称中的单引号会剪切“O”之后的字符串，所以索引返回1三次

在jquery中检查我的注释

以下是我在演示中使用的html：

<div class="optionDiv">
    Filter by Category
    <select id="selectCat">
        <option value="NoCategory">NoCategory</option>
        <option value="First_Name">First_Name</option>
        <option value="Surname" selected>Surname</option>
        <option value="Address">Address</option>
    </select>
    Filter by Selected Category
    <select id="selectField">
        <option value="All" selected>All</option>   
        <option value="O'Reilly">O'Reilly</option>
    </select>
</div>  
<table id="myTable">
    <thead> 
        <tr id=HeadRow><th>First_Name</th><th>Surname</th><th>Address</th><th>ID</th></tr>                      
    </thead>  
    <tbody> 
        <tr><td>Michael</td><td>O'Reilly</td><td>581 Beech Street, Lincoln, NE 68506</td><td>246</td></tr>
        <tr><td>Della</td><td>Austin'</td><td>376 Washington Street, Pompano Beach, FL 33060</td><td>247</td></tr>
        <tr><td>Hector</td><td>Hopkins</td><td>442 College Street, East Brunswick, NJ 08816</td><td>248</td></tr>
        <tr><td>Terrance</td><td>Garza'</td><td>737 Route 1, Mahwah, NJ 07430</td><td>249</td></tr>
        <tr><td>Melvin</td><td>Boyd'</td><td>525 Olive Street, Derby, KS 67037</td><td>250</td></tr>
        <tr><td>Kimberly</td><td>Alvarez'</td><td>269 Olive Street, Redondo Beach, CA 90278</td><td>251</td></tr>
        <tr><td>Eleanor</td><td>Steele'</td><td>447 Canal Street, Goose Creek, SC 29445 </td><td>252</td></tr>
        <tr><td>Elsa</td><td>Osborne'</td><td>894 Pheasant Run, Pottstown, PA 19464</td><td>253</td></tr>
        <tr><td>Cameron</td><td>Huff'</td><td>416 Parker Street, Riverdale, GA 30274</td><td>254</td></tr>
        <tr><td>Essie</td><td>Ray'</td><td>539 Devon Court, Woodhaven, NY 11421</td><td>255</td></tr>
        <tr><td>I'Am</td><td>TheBest</td><td>MyStreet 75</td><td>256</td></tr>
        <tr><td>Bilbo</td><td>Baggins</td><td>Shire</td><td>257</td></tr>
        <tr><td>Larry</td><td>I'Connol</td><td>Larrys's Street 45</td><td>258</td></tr>
        <tr><td>Martin</td><td>O'Bannon</td><td>Martins's Street, 56</td><td>259</td></tr>
    </tbody>
</table>

---

请设置一个JSFIDLE，它为jquery和html提供一些目标行和非目标行。您提供的代码中存在错误或缺失，因为在条件语句中使用

selVal

之前从未声明过它。如果您没有提供可复制错误的代码的问题，您的问题可能会被忽略，被否决，和/或被关闭。帮助我们帮助你。我已经添加了我正在使用的所有代码，除了第一个html文件，它只包含简单的按钮。亲爱的上帝，不。删除所有的php和css。你应该提供最基本的信息来允许问题的复制。我只想看到源代码html和jquery。请在暴躁的选民到来之前更新你的问题。好吧，我已经删除了大部分php代码，只留下了javascript和html…很抱歉，我可能会迷失方向，但我不知道我现在是否提供了正确的答案…但我也删除了用于json的php部分…但我需要看到的两件事是：表数据（在数据库fed php中仍然有）。加载页面，访问源html代码，复制表中的几行，包括O'Reilly行，并将其添加到您的问题中，您是否注意到javascript声明

selVal=''；

它没有任何变化，然后检查它是否匹配

First\u Name

，等等。您需要修复这部分。@Vlad67如果这足够的话解决你的问题

function addRemoveClass(theRows){
    theRows.removeClass("odd even");
    theRows.filter(":odd").addClass("odd");
    theRows.filter(":even").addClass("even");
}   
var selVal='';
var rows=$('#myTable tbody tr');
addRemoveClass(rows);
$("#selectField").on("change",function() {
    $('table').show();
    var selection = $(this).val();
    var dataset = $('#myTable tbody').find('tr');
    var selVal = $('#selectCat').val();  // Mick added this
    dataset.show();
    // filter the rows that should be hidden
    if(selVal!="All"){  // Mick added this
    // if(selection!="All"){  // Mick removed this
        console.log(selection+' & '+selVal);  // Mick added this
        // Mick says no escaping needed
        //selection=selection.replace(/'/g, '"');
        //selection = selection.replace(/'/g, "\\'");
        if(selVal=="Surname"){
            dataset.filter(function(index, item) {  
                console.log(index+' & '+item+' & '+selection);  // Mick added this
                return $(item).find('td:nth-child(2)').text().indexOf(selection)=== -1;
            }).hide();
        }else{
            dataset.show();
        }
    }else{
        dataset.show();     
    }
});