Question

我有一个带有radiobuttons的表单和一个按钮，可以根据这些radiobuttons到texfield的值生成文本。

有些问题考虑到相同的问题（疾病），问题是这种疾病的症状，如：

您是否有症状编号1（radiobuttons YES，值=＆＃34;症状1＆＃34; NO，没有值（值=＆＃34;＆＃34;）
您是否有症状编号2（radiobuttons YES，值=＆＃34;症状2＆＃34; NO，值=＆＃34;＆＃34;） ...等等。

按钮然后支持生成=患者有此症状：症状1，症状2，症状3。

问题是：我如何加入这些radiobuttons的值并在它们之间添加逗号和空格（，）。此外，我不想包括那些没有被选中的值（也没有逗号和空格）。因此输出将是症状1是，症状2否，症状3是，症状4否：患者有这种疾病的症状;症状1，症状3。

如果＆＃34;和＆＃34;这个词会更好。也可以。

如果我将它们设置在数组中，它总是按下逗号，是否选中“否”或“是”，因此它需要一些修剪（或某些东西......？）

现在我的jquery看起来像：

JAVASCRIPT / JQUERY：

$("#BUTTON").click(function () {
var symptom1 = $("input[name=symptom1]:checked").val();
var symptom2 = $("input[name=symptom2]:checked").val();
var symptom3 = $("input[name=symptom3]:checked").val();
var symptom4= $("input[name=symptom4]:checked").val();

$("#RESULTTEXTBOX").val("Patient has symptoms of this disease" + symptom1 + symptom2 + symptom3 + symptom4 + ".");

HTML：

 Symptom1 ?<input id="symptom1yes" name="symptom1" type="radio" value=" symptom1" /> YES 
    <input id="symptom1no" name="symptom1" type="radio" value="" />NO<br>

Symptom2 ?<input id="symptom2yes" name="symptom2" type="radio" value=" symptom2" /> YES 
    <input id="symptom2no" name="symptom2" type="radio" value="" />NO<br>

Symptom3 ?<input id="symptom3yes" name="symptom3" type="radio" value=" symptom3" /> YES 
    <input id="symptom3no" name="symptom3" type="radio" value="" />NO<br>

Symptom4 ?<input id="symptom4yes" name="symptom4" type="radio" value=" symptom4" /> YES 
    <input id="symptom4no" name="symptom4" type="radio" value="" />NO<br><br>
    <button id="BUTTON">Generate text</button>
    <br><br>
    <textarea cols="34" id="RESULTTEXTBOX" name="RESULTTEXTBOX" rows="1" style="height: 98px; width: 473px"></textarea>

编辑：DEMO

＆＃13;

    $("#BUTTON").click(function () {
    var symptom1 = $("input[name=symptom1]:checked").val();
    var symptom2 = $("input[name=symptom2]:checked").val();
    var symptom3 = $("input[name=symptom3]:checked").val();
    var symptom4= $("input[name=symptom4]:checked").val();

    $("#RESULTTEXTBOX").val("Patient has symptoms of this disease" + symptom1 + symptom2 + symptom3 + symptom4 + ".");
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

     Symptom1 ?<input id="symptom1yes" name="symptom1" type="radio" value=" symptom1" /> YES 
        <input id="symptom1no" name="symptom1" type="radio" value="" />NO<br>
        
    Symptom2 ?<input id="symptom2yes" name="symptom2" type="radio" value=" symptom2" /> YES 
        <input id="symptom2no" name="symptom2" type="radio" value="" />NO<br>
        
    Symptom3 ?<input id="symptom3yes" name="symptom3" type="radio" value=" symptom3" /> YES 
        <input id="symptom3no" name="symptom3" type="radio" value="" />NO<br>
        
    Symptom4 ?<input id="symptom4yes" name="symptom4" type="radio" value=" symptom4" /> YES 
        <input id="symptom4no" name="symptom4" type="radio" value="" />NO<br><br>
        <button id="BUTTON">Generate text</button>
        <br><br>
        <textarea cols="34" id="RESULTTEXTBOX" name="RESULTTEXTBOX" rows="1" style="height: 98px; width: 473px"></textarea>

＆＃13;

Answer 1

您可以在选择器中使用^=来获取名称以＆＃34;症状＆＃34;开头的所有选定无线电，然后使用$.map将值放入数组中，可以使用逗号连接：

var selectedSymptoms = $.map($("input[name^='symptom']:checked"),
                             function(radioButton) { return radioButton.value });
var selectedSymtomsYes = selectedSymptoms.filter(function(symptom) { return symptom });

var selectedSymptomsText = selectedSymtomsYes.join(",");

要使用＆＃34;和＆＃34;来生成文本，您可以执行此操作而不是最后一行：

var selectedSymptomsText = selectedSymtomsYes.join(",").replace(/,(?!.*,)/gmi, "and");

Answer 2

我认为这会对你有帮助。

只需将这些行添加到您的代码中即可。

                var symtoms = (symptom1 == "" ? "" : symptom1 + ", ")
                        + (symptom2 == "" ? "" : symptom2 + ", ")
                        + (symptom3 == "" ? "" : symptom3 + ", ")
                        + (symptom4 == "" ? "" : symptom4 + ", ");
                var res = symtoms.trim().replace(/,{1,}$/, '');

                $("#RESULTTEXTBOX").val("Patient has symptoms of this disease" + res + ".");

Answer 3

这是建立阿尔伯托斯答案的一些东西，然而这支持牛津逗号。此外，过滤器表达式更具可读性。

$("#BUTTON").click(function () {
  var symptoms = $("input[name^=symptom]:checked").filter(function(){return this.value.trim() !== ""; });
  var values = $.map(symptoms,function(e,i){ return e.value});

  $("#RESULTTEXTBOX").text("Patient has symptoms of this disease. " + formatArray(values) );
});

function formatArray(arr){
    var outStr = "";
    if (arr.length === 1) {
        outStr = arr[0];
    } else if (arr.length === 2) {
        outStr = arr.join(' and ');
    } else if (arr.length > 2) {
       outStr = arr.slice(0, -1).join(', ') + ', and ' + arr.slice(-1);
    }
    return outStr;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
   Symptom1 ?<input id="symptom1yes" name="symptom1" type="radio" value="symptom1" /> YES 
   <input id="symptom1no" name="symptom1" type="radio" value="" />NO<br>
   Symptom2 ?<input id="symptom2yes" name="symptom2" type="radio" value="symptom2" /> YES 
   <input id="symptom2no" name="symptom2" type="radio" value="" />NO<br>
   Symptom3 ?<input id="symptom3yes" name="symptom3" type="radio" value="symptom3" /> YES 
   <input id="symptom3no" name="symptom3" type="radio" value="" />NO<br>
   Symptom4 ?<input id="symptom4yes" name="symptom4" type="radio" value="symptom4" /> YES 
   <input id="symptom4no" name="symptom4" type="radio" value="" />NO<br><br>
   <button id="BUTTON">Generate text</button>
   <br><br>
   <textarea cols="34" id="RESULTTEXTBOX" name="RESULTTEXTBOX" rows="1" style="height: 98px; width: 473px"></textarea>
</body>

加入＆amp;仅打印带有文本的值并在其间添加逗号

3 个答案: