Question

如何拆分字符串和最多html标签

请考虑以下字符串

string = "User1&39f3b327-5655-4ed8-a714-1b7caf43f0e8,Organisation1&45df327-5655-4ed8-a714-1b7cs87fg,Developer&4bbd9e8b-f5f5-4988-b8b5-47bfdd5f8840,true || User2&45bc7b3f-e2ef-4fbb-8212-7f52895ee8e8, Organisation2&7324fd5-435ed8-a7454-5b7cafd5gd, Admin&a2a8f46d-d4cf-4537-b40f-c3b299ac7ef8,true"

期望：

 <li class="fe_pui-autocomplete-box">
      <p class="parent_author_p">
          <span class="add_author_name_value" data-id="39f3b327-5655-4ed8-a714-1b7caf43f0e8">User1</span>
          <span class="add_org_name_value" data-id="45df327-5655-4ed8-a714-1b7cs87fg">Org1</span>
          <span class="add_role_name_value" data-id="4bbd9e8b-f5f5-4988-b8b5-47bfdd5f8840">Developer</span>
          <input type="checkbox" class="author_credit_button_list" value="true" checked="">
          <a href="javascript:void(0);" class="closebutton author_table_destroy"></a>
      </p>
</li>
<li class="fe_pui-autocomplete-box">
    <p class="parent_author_p">
        <span class="add_author_name_value" data-id="45bc7b3f-e2ef-4fbb-8212-7f52895ee8e8">User2</span>
        <span class="add_org_name_value" data-id="7324fd5-435ed8-a7454-5b7cafd5gd">Organisation2</span>
        <span class="add_role_name_value" data-id="a2a8f46d-d4cf-4537-b40f-c3b299ac7ef8">Admin</span>
        <input type="checkbox" class="author_credit_button_list" value="true" checked="">
        <a href="javascript:void(0);" class="closebutton author_table_destroy">
        </a>
    </p>
</li>

使用：jQuery

我们必须拆分字符串并分配给HTML标签

平均字符串到Html

Answer 1

下面有一个可能的解决方案，希望它有所帮助。

var str = 'User1&39f3b327-5655-4ed8-714-1b7caf43f0e8,Organisation1&45df327-5655-4ed8-714-1b7cs87fg,Developer&4bbd9e8b-f5f5-4988-b8b5-47bfdd5f8840,true || User2&45bc7b3f-e2ef-4fbb-8212-7f52895ee8e8, Organisation2&7324fd5-435ed8-a7454-5b7cafd5gd, Admin&a2a8f46d-d4cf-4537-b40f-c3b299ac7ef8,true';

var strHtml = '';
var classArray = ['add_author_name_value','add_org_name_value','add_role_name_value','author_credit_button_list'];
var splitStr = str.split('||');

for (var a = 0; a < splitStr.length; a++) {	
	var splitByComma = splitStr[a].split(',');
	strHtml += '<li class="fe_pui-autocomplete-box">';
	strHtml += '<p class="parent_author_p">';

	for (var b = 0; b < splitByComma.length; b++) {		
		var className = classArray[b];	
		var splitByAmp = splitByComma[b].split('&');	
	
		switch (className) {
			case 'author_credit_button_list':
				strHtml += '<input type="checkbox" class="' + className + '" value="' + splitByAmp[0] + '" checked="">';
				break;
			default:
				strHtml += '<span class="' + className + '" data-id="' + splitByAmp[1] + '">' + splitByAmp[0] + '</span>';
		}		
	} 	
	strHtml += '<a href="javascript:void(0);" class="closebutton author_table_destroy"></a>';
	strHtml += '</p>';
	strHtml += '</li>';
}

Answer 2

var String="User1&39f3b327-5655-4ed8-a714-1b7caf43f0e8,Organisation1&45df327-5655-4ed8-a714-1b7cs87fg,Developer&4bbd9e8b-f5f5-4988-b8b5-47bfdd5f8840,true || User2&45bc7b3f-e2ef-4fbb-8212-7f52895ee8e8, Organisation2&7324fd5-435ed8-a7454-5b7cafd5gd, Admin&a2a8f46d-d4cf-4537-b40f-c3b299ac7ef8,true";

var Res=String.split("||");
var Classes=["add_author_name_value","add_org_name_value","add_role_name_value"];
for(j=0;j<Res.length;j++)
{
  var commaSeparateRes=Res[j].split(",");
  for(k=0;k<commaSeparateRes.length;k++)
  {
     var andSeparatorRes=commaSeparateRes[k].split("&");
     var x = document.getElementsByClassName(Classes[k]);
     x.setAttribute('data-id',commaSeparateRes[1]);       document.getElementsByClassName(Classes[j]).innerHtml=commaSeparateRes[0];
  }    }

如何拆分字符串和html标签？

2 个答案: