我尝试在 JS/jQuery 中解决这个问题,但无法理解它。我有一个文本 block ,我想将其粘贴到文本区域中,它将生成 x 行(表)行以及其中的输入。它始终是一个时间码,后跟一个文本,然后是另一个时间码。如何将这样的内容粘贴到文本区域中:
01:00:17:02.28 1m01 Main Title 00:02:32:17.47
01:22:04:15.77 Hit at 1:22:30 00:00:20:10.01
01:26:23:17.60 1M2s - End Title 00:01:22:14.01
并生成这个:
<table>
<tr>
<td><input value="01:00:17:02.28"></td>
<td><input value="1"></td>
<td><input value="m"></td>
<td><input value="01"></td>
<td><input value="Main Title"></td>
<td><input value="00:02:32:17.47"></td>
</tr>
<tr>
<td><input value="01:22:04:15.77"></td>
<td><input value=""></td>
<td><input value=""></td>
<td><input value=""></td>
<td><input value="Hit at 1:22:30"></td>
<td><input value="00:00:20:10.01"></td>
</tr>
<tr>
<td><input value="01:26:23:17.60"></td>
<td><input value="101"></td>
<td><input value="M"></td>
<td><input value="2s"></td>
<td><input value="End Title"></td>
<td><input value="00:01:22:14.01"></td>
</tr>
</table>
换句话说:
- 打破第一个时间码
- 查看中间 block 是否以语法 1m1s 开头(数字、大写或小写“m”、字符串...无空格)。如果是,请将它们分开 三个出来,如果之后还有什么,就把它放进去 自己的输入。
- 如果中间 block 不是以语法开头,则将整个 第 5 个输入中的字符串
- 以最后一个时间码结束
如果第五个输入可以 trim 掉任何分隔符,那就有好处了。就像“- End Title”将是第三行的“End Title”。
感谢您的想法!
最佳答案
这是您可以使用的一些内容,其余的应该非常简单。 Javascript 中有许多不同的函数可用于查询和操作字符串,我使用了不同的函数,以便您将来可以引用。
01:00:17:02.28 1m01 Main Title 00:02:32:17.47
01:22:04:15.77 Hit at 1:22:30 00:00:20:10.01
01:26:23:17.60 1M2s - End Title 00:01:22:14.01
如果您复制上面的内容,并将其粘贴到文本字段中,然后单击按钮,它应该根据您的条件对字符串进行排序。
function niceFunction() {
var test = document.getElementById("test").value;
var div1 = document.getElementById("div1");
var awesomeObjects = doCoolThingsWithString(test);
for(var x = 0; x<=2; x++){
div1.innerHTML = div1.innerHTML + " | first segment = " +awesomeObjects[x].first;
div1.innerHTML = div1.innerHTML + " | second segment = " + awesomeObjects[x].second;
if(awesomeObjects[x].fourth){
div1.innerHTML = div1.innerHTML + " | third segment = " +awesomeObjects[x].third;
div1.innerHTML = div1.innerHTML + " | fourth segment = " +awesomeObjects[x].fourth + "</br>";
}
else{
div1.innerHTML = div1.innerHTML + " | third segment = " +awesomeObjects[x].third+ "</br>";
}
}
}
document.getElementById("clickMe").onclick = niceFunction;
function doCoolThingsWithString(string) {
var test = string;
var doubleSplit = [];
test = test.replace(/\n\r?/g, '|');
test = test.replace('-','');
test = test.split("|");
//test = test.match(/\S+/g);
for (var x = 0; x <= test.length - 1; x++) {
var temp = test[x].match(/\S+/g);
if (isNaN(parseInt(temp[1].substring(0, 1)))) {
var second = temp[1] + " " + temp[2] + " " + temp[3];
doubleSplit.push({
"first": temp[0],
"second": second,
"third": temp[4],
"bool": isNaN(parseInt(temp[1].substring(0, 1)))
});
} else {
var third = temp[2] + " " + temp[3];
doubleSplit.push({
"first": temp[0],
"second": temp[1],
"third": third,
"fourth": temp[4],
"bool": isNaN(parseInt(temp[1].substring(0, 1)))
});
}
}
//test = test[5];
return doubleSplit;
}
<textarea rows="4" cols="50" id="test">
</textarea>
<div id="div1"></div>
<input id="clickMe" type="button" value="clickme" />
一些解释:
- 获取文本框值
- 用明显的字符替换换行符,在我的例子中
|
(replace
函数) - 根据您的要求删除
-
(replace
功能) - 按
|
字符拆分字符串(split
函数) - split 函数创建一个数组,例如索引 0 为
01:00:17:02.28 1m01 Main Title 00:02:32:17.47
... - 循环数组并使用
match
函数获取所有非空白(存储为数组) - 检查第二个索引的第一个字符是否为
NaN
(不是数字) - 如果不是数字,则实现一项要求
- 否则实现其他要求
- 将其存储在字典列表中以便于访问
- 使用
createElement
函数创建标签,如下所示var x = document.createElement("TABLE");
关于javascript - 在 JS 中转动特定的文本 block 并生成行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43423283/