Javascript 将值分隔从“更改为”&引用；至-&引用；（JS/Jquery）

我收到了一些HTML复选框的Jquery代码。基本上，选中时，复选框的值将放置在输入框中。当我取消选中该框时，该值将从输入中清除。但是，当您选中多个复选框时，将用“，”分隔这些值有没有办法用“-”而不是“，”来分隔值？我试着处理代码，结果代码被破坏了。我对JS/Jquery相当陌生，所以如果这是一个简单的答案，我道歉。如果需要，我可以提供更多信息。这里有一个使用“，”的JSFIDLE：

我的代码位于此处：

 var $choiceDisplay = $("#choiceDisplay"), //jquery selector for the display box
    $none = $("#none"),
    $choice = $(".choice");

$choice.on("change", function () {
    var $this = $(this), //jquery selector for the changed input
    isThisChecked = $this.prop("checked"), //boolean true if the box is checked
    choiceSelectionsArray = $choiceDisplay.val().split(",").filter(function(e){return e !== ""}), //array of values that are checked
    isThisValueInDisplayedSelection = $.inArray($this.val(), choiceSelectionsArray) !== -1; //boolean true when $this value displayed

if (isThisChecked) {
    if (isThisValueInDisplayedSelection) {
        return false; //odd, the value is already displayed.  No work to do.
    } else {
        choiceSelectionsArray.push($this.val());
        $choiceDisplay.val(choiceSelectionsArray.join());
    }
} else { //box has been unchecked
    if (isThisValueInDisplayedSelection) {
        choiceSelectionsArray = choiceSelectionsArray.filter(function(e){return e !== $this.val()})
        $choiceDisplay.val(choiceSelectionsArray.join());
    }
}
});

$none.on("change", function () {
   var $this = $(this),
   isThisChecked = $this.prop("checked");
if(isThisChecked){
    $choice.prop({
        disabled: true,
        checked : false
    });
    $choiceDisplay.val("");
}else{
    $choice.prop({disabled: false});
    return false;
}
});

在$.join（）中添加分隔符字符串参数：

$choiceDisplay.val(choiceSelectionsArray.join("-"));

更新：

在$.split（）中添加相同的

---

在函数

join（）

和

split（）

中，需要传入所需的分隔符

'-'

。我建议创建一个您使用的局部变量，以便在需要时更容易更改它

var $choiceDisplay = $("#choiceDisplay"), //jquery selector for the display box
    $none = $("#none"),
    $choice = $(".choice"),
    delimiter = '-';

$choice.on("change", function () {
    var $this = $(this), //jquery selector for the changed input
        isThisChecked = $this.prop("checked"), //boolean true if the box is checked
        choiceSelectionsArray = $choiceDisplay.val().split(delimiter).filter(function(e){return e !== ""}), //array of values that are checked
        isThisValueInDisplayedSelection = $.inArray($this.val(), choiceSelectionsArray) !== -1; //boolean true when $this value displayed

    if (isThisChecked) {
        if (isThisValueInDisplayedSelection) {
            return false; //odd, the value is already displayed.  No work to do.
        } else {
            choiceSelectionsArray.push($this.val());
            $choiceDisplay.val(choiceSelectionsArray.join(delimiter));
        }
    } else { //box has been unchecked
        if (isThisValueInDisplayedSelection) {
            choiceSelectionsArray = choiceSelectionsArray.filter(function(e){return e !== $this.val()})
            $choiceDisplay.val(choiceSelectionsArray.join(delimiter));
        }
    }
});

这是一个盒子

var $choiceDisplay = $("#choiceDisplay"), //jquery selector for the display box
    $none = $("#none"),
    $choice = $(".choice"),
    delimiter = '-';

$choice.on("change", function () {
    var $this = $(this), //jquery selector for the changed input
        isThisChecked = $this.prop("checked"), //boolean true if the box is checked
        choiceSelectionsArray = $choiceDisplay.val().split(delimiter).filter(function(e){return e !== ""}), //array of values that are checked
        isThisValueInDisplayedSelection = $.inArray($this.val(), choiceSelectionsArray) !== -1; //boolean true when $this value displayed

    if (isThisChecked) {
        if (isThisValueInDisplayedSelection) {
            return false; //odd, the value is already displayed.  No work to do.
        } else {
            choiceSelectionsArray.push($this.val());
            $choiceDisplay.val(choiceSelectionsArray.join(delimiter));
        }
    } else { //box has been unchecked
        if (isThisValueInDisplayedSelection) {
            choiceSelectionsArray = choiceSelectionsArray.filter(function(e){return e !== $this.val()})
            $choiceDisplay.val(choiceSelectionsArray.join(delimiter));
        }
    }
});