0

我有以下带有一些值的输入：

HTML

<input id="input_post_id" type="hidden" name="varPostId" value="29644,29650,63186,99616,101647">

单击时，我检查单击的按钮data attribute是否包含number其中，input .val()如果有，请将其删除：

JS

$(".removeJiku").on("click", function(){
  var removeThisId = $(".removeId").attr("data-thisPostId"); 
  $("#input_post_id").val($("#input_post_id").val().replace(removeThisId,''));
});

但以上js不是删除数字。Button是：

<button data-thispostid="101647" type="button" class="removeJiku">Remove</button>

笔记：

我需要删除number和它comma太

4

4 回答 4

2

$(".removeId")不是你的按钮。相反，您应该编写$(this)如下工作代码所示。

此外，您替换值的方式将在那里留下一个,，而是以其他方式完成。已将值拆分,，然后将其删除（如果存在）并再次加入它们,。

$(".removeJiku").on("click", function(){
  var removeThisId = $(this).attr("data-thisPostId");
  var postIds = $("#input_post_id").val();
  if(removeThisId && postIds){
    postIds = postIds.split(",");
  
    if(postIds.indexOf(removeThisId) > -1){
      postIds.splice(postIds.indexOf(removeThisId), 1);
    }
     $("#input_post_id").val(postIds.join(","));
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="input_post_id" type="hidden" name="varPostId" value="29644,29650,63186,99616,101647"/>
<button data-thispostid="101647" type="button" class="removeJiku">Remove</button>

于 2018-06-20T18:06:16.900 回答
1

正如我在评论中提到的，您的按钮选择器是错误的，因此您没有获取该属性。你可以$(this)改用。

要删除逗号，您可以使用 将逗号分隔值转换为数组.split(",")，使用 删除数组中的 ID .filter()，然后使用 将数组重新连接在一起.join(",")。

$(".removeJiku").on("click", function() {
  var removeThisId = $(this).attr("data-thisPostId");
  var $input = $("#input_post_id");

  console.log("BEFORE:", $input.val()); //For demo purposes

  var vals = $input.val().split(",").filter(item => item !== removeThisId).join(",");
  $input.val(vals);

  console.log("AFTER:", vals); //For demo purposes
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="input_post_id" type="hidden" name="varPostId" value="29644,29650,63186,99616,101647">
<button data-thispostid="101647" type="button" class="removeJiku">Remove</button>

于 2018-06-20T18:11:52.613 回答
1

replace()将替换字符串中出现的子字符串，仅替换该值的第一个实例。

filter()方法创建一个新数组，其中包含通过所提供函数实现的测试的所有元素。

split()方法将字符串对象拆分为字符串数组，方法是将字符串分隔为子字符串，使用指定的分隔符字符串确定每次拆分的位置。

join() 方法将数组（或类似数组的对象）的所有元素连接成一个字符串并返回该字符串。 

   

 $(".removeJiku").on("click", function(){
      var removeThisId = $(".removeId").attr("data-thisPostId"); 
      var inputVal = $("#input_post_id").val();
    
    inputVal = inputVal.replace(removeThisId,"");

    inputVal = inputVal.split(",").filter(Number).join(",");

      $("#input_post_id").val(inputVal);
      console.log($("#input_post_id").val());
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

<button data-thispostid="101647" type="button" class="removeJiku removeId">Remove</button>

<input id="input_post_id" type="hidden" name="varPostId" value="29644,29650,101647,63186,99616">

于 2018-06-20T18:19:40.757 回答
0

您可以从下面的隐藏字段中删除值

<input id="input_post_id" type="hidden" name="varPostId" value="29644,29650,63186,99616,101647">

通过使用下面的代码

$(".removeJiku").on("click", function(){
  var removeThisId = $(this).attr("data-thisPostId"); 

  $("#input_post_id").val($("#input_post_id").val().replace(removeThisId,'').replace(/,\s*$/, ""));

});

在您的代码中，我只是替换以下行

var removeThisId = $(".removeId").attr("data-thisPostId");

到

var removeThisId = $(this).attr("data-thisPostId");

您的代码的问题是类 .removeId 在您的代码中不可用或该类不可访问。您可以检查以控制 removeThisId 的值以调试您的代码或使用任何浏览器调试工具

于 2018-06-20T18:11:39.520 回答