javascript - 在javascript中用逗号分隔的字符串分割值

Question

这是我的问题:

我有 RadListBox，我正在尝试获取值并附加它们，以便结果显示如下:“1,2,3,4”，但我正在返回:1,2,3,4 , 有谁知道我怎样才能实现这一目标？

问题从这里开始:

var sbLocationsIDS = new StringBuilder();
             for (i = 0; i < LocationIDS.get_items().get_count(); i++) {
                 sbLocationsIDS.append(LocationIDS.getItem(i).get_value()+ ",");  
             }

结果:sbLocationsIDS =1,2,3,4，而不是“1,2,3,4”

其余代码:

 function openNewTab(url) {
         var captureURL = url;
         var win = window.open(captureURL, '_blank');
         win.focus();
     }

     function GetComparisonsReport(sender, args) {
         var isValid = Page_ClientValidate('validateComparisons');
         if (isValid) { // If its true is going to fire the rest of the code
             var SessionID = getUrlVars()["SessionID"];
             var companyCodeVal = document.getElementById("<%=hfC.ClientID%>").value;
             var LocationIDS = $find("<%=rlbSelectedLocation.ClientID %>");
             var CategoriesIDS = $find("<%=rlbSelectedCategory.ClientID %>");
             var fileType = $find("<%=rcbFileType.ClientID %>");
             var fromFirstPeriod = $find("<%=rdpFromFirstPeriod.ClientID %>");
             var toFirstPeriod = $find("<%=rdpToFirstPeriod.ClientID %>");
             var fromSecondPeriod = $find("<%=rdpFromSecondPeriod.ClientID %>");
             var toSecondPeriod = $find("<%=rdpToSecondPeriod.ClientID %>");;
              if (LocationIDS.get_items().get_count() < 0) {
                 radalert("Please choose locations and select the Add button.<h3 style='color: #ff0000;'></h3>", 420, 170, "Case Global Alert");
                 return;
             }
             if (CategoriesIDS.get_items().get_count() < 0) {
                 radalert("Please choose categories and select the Add button.<h3 style='color: #ff0000;'></h3>", 420, 170, "Case Global Alert");
                 return;
             }
             var fromFirstPeriodDateValSelected = fromFirstPeriod.get_dateInput().get_selectedDate().format("yyyy/MM/dd");
             var toFirstPeriodDateValSelected = toFirstPeriod.get_dateInput().get_selectedDate().format("yyyy/MM/dd");
             var fromSecondPeriodDateValSelected = fromSecondPeriod.get_dateInput().get_selectedDate().format("yyyy/MM/dd");
             var toSecondPeriodDateValSelected = toSecondPeriod.get_dateInput().get_selectedDate().format("yyyy/MM/dd");
             var fileTypeValSelected = fileType.get_selectedItem().get_value();


             var sbLocationsIDS = new StringBuilder();
             for (i = 0; i < LocationIDS.get_items().get_count(); i++) {
                 sbLocationsIDS.append(LocationIDS.getItem(i).get_value()+ ",");  // The problem is here!!!
             }
             var sbCategoriesIDS = new StringBuilder();
             for (i = 0; i < CategoriesIDS.get_items().get_count(); i++) {
                 sbCategoriesIDS.append(CategoriesIDS.getItem(i).get_value() + ",");
             }
             var ComparisonsURL = (String.format("https://www.test.com/cgis/{0}/reports/ConnectTorptIncidentsCountByLocationInterval.asp?SessionID={1}&locString={2}&catString={3}&FromDate1={4}&&ToDate1={5}&FromDate2={6}&ToDate2={7}&ExportType={8}", companyCodeVal, SessionID, sbLocationsIDS, sbCategoriesIDS, fromFirstPeriodDateValSelected, toFirstPeriodDateValSelected, fromSecondPeriodDateValSelected, toSecondPeriodDateValSelected, fileTypeValSelected));
             openNewTab(ComparisonsURL);
         }
     }

     String.format = function () {
         // The string containing the format items (e.g. "{0}")
         // will and always has to be the first argument.
         var theString = arguments[0];
         // start with the second argument (i = 1)
         for (var i = 1; i < arguments.length; i++) {
             // "gm" = RegEx options for Global search (more than one instance)
             // and for Multiline search
             var regEx = new RegExp("\\{" + (i - 1) + "\\}", "gm");
             theString = theString.replace(regEx, arguments[i]);
         }
         return theString;
     }

     function getUrlVars() {
         var vars = {};
         var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (m, key, value) {
             vars[key] = value;
         });
         return vars;
     }

     // Initializes a new instance of the StringBuilder class
     // and appends the given value if supplied
     function StringBuilder(value) {
         this.strings = new Array("");
         this.append(value);
     }

     // Appends the given value to the end of this instance.
     StringBuilder.prototype.append = function (value) {
         if (value) {
             this.strings.push(value);
         }
     }

     // Clears the string buffer
     StringBuilder.prototype.clear = function () {
         this.strings.length = 1;
     }

     // Converts this instance to a String.
     StringBuilder.prototype.toString = function () {
         return this.strings.join("");
     }

Answer 1

问题是您的循环总是附加 , ，甚至对于循环中的最后一项也是如此。

您只想附加除最后一项之外的所有项目。有多种方法可以做到这一点，最简单的是:检查当前元素是否是最后一个，如果是，则不附加 ,

    var sbLocationsIDS = new StringBuilder();
    for (i = 0; i < LocationIDS.get_items().get_count(); i++) {
        sbLocationsIDS.append(LocationIDS.getItem(i).get_value()); //append only value
        if(i != (LocationIDS.get_items().get_count() -1)) { //if not last item in list
            sbLocationsIDS.append(","); //append ,
        }
    }

还有其他方法可以做到这一点，并且根据您将来想要对这些值执行的操作，这些方法可能非常有用。 (我看到代码中的 append 实际上是对 join 的调用，所以这实际上是一个更简单的版本)

将列表的值添加到数组中并使用 Array.join :

var select = document.getElementById("locationId");
var options = select.options;
var optionsArray = [];
if(options) {
    for (var i=0; i<=options.length; i++) {
        //text is the text displayed in the dropdown. 
        //You can also use value which is from the value attribute of >option>
        optionsArray.push(options[i].text);  
    }
}
var sbLocationsIDS = optionsArray.join(",");

使用 JQuery，上面的代码变得更加简单:

var optionsArray = [];
$("#locationId option").each(function(){
    optionsArray.push(options[i].text);
});
var sbLocationsIDS = optionsArray.join(",");

实际上，如果您决定使用 JQuery，则可以使用 jquery.map : (想法来自Assigning select list values to array)

$(document).ready(function() {
  $("#b").click(function() {
    var sbLocationsIDS = jQuery.map($("#locationId option"), function(n, i) {
      return (n.value);
    }).join(",");
    alert(sbLocationsIDS);

  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="locationId">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>
<button id="b">Click</button>