如何使用 Jquery 根据 ID 在两个 Div 之间追加一个 Div？

Question

如果我有这些对象：

<div id='1'></div>
<div id='2'></div>
<div id='3'></div>
<div id='4'></div>
<div id='5'></div>

我有一个文本框：

<input type="text">

在其中输入值： 3.5 来动态生成（我有这方面的代码，下一部分需要帮助）：

<div id='3.5'></div>

如何按此顺序附加它下面，没有首先检查页面上每个 div 的值？

<div id='1'></div>
<div id='2'></div>
<div id='3'></div>
<div id='3.5'></div>
<div id='4'></div>
<div id='5'></div>

使用：

$('#What Goes Here If I Dont know the elements on the page?').after('<div id='3.5'>Hey</div>');

感谢任何帮助，

泰勒

Answer 1

DOM 中的 ID 不应以数字开头（它们无效）。
它们应该以字符 A-Za-z 开头，然后可以有数字、- 和 _。

但如果你想走你的路线试试这个：

var div = $("<div id='3.5'></div>");
div_id_after = Math.floor(parseFloat(div.get(0).id));

$('#'+div_id_after).after(div);

这是一个小提琴演示： http://jsfiddle.net/maniator /DPMV5/

Answer 2

这有什么问题吗？

  $('#3').after('<div id='3.5'>Hey</div>');

Answer 3

首先，ID 不允许以数字开头。

忽略这一点，如果只允许整数，很简单，只需从值中取出 1 并插入它，然后对其余部分重新编号。否则，您必须先遍历 DOM 来检查其他值。

Answer 4

添加的比较是算术运算，因此不幸的是，您需要迭代可以执行此操作的 div。也许你应该做填充，比如 3 = 300000，所以 3.5 是 3500000，以进行最佳比较。

Answer 5

也许类似的东西会起作用：

var text = yourTextBox.value;
if(var number = Number(text))
{
    $('#'+Math.floor(number)).after('<div id='+text+'>Hey</div>');
} 
else alert("wrong number");

但是你应该首先检查（使用正则表达式）文本框中的文本是否是合法的数字......

Answer 6

现场演示

var input = "3.5";
var parent = Math.floor(input);
var dest = $('#div-'+parent);

dest.after(dest.clone().attr('id','div-'+input).text(input));

注意：这只能工作一次在整数之间。更可靠的方法确实需要查看目标中所有 div 的 ID。

Answer 7

已更新。谢谢尼尔。

http://jsfiddle.net/FB8xG/3/

var newValue = 3.5;

var oldValue = Math.floor(newValue); //3

var oldValueID = ('#' + oldValue);
var newValueID = ('<div id="' + newValue + '">' + newValue + '</div>');

$(oldValueID).after(newValueID);