拖放会破坏 ID 编号方案？

Question

我有一个包含问卷编辑器的网络应用程序。可能有很多问题；每个都可以有很多答案；每个问题都有两组单选按钮，用于设置各种问题选项。

我正在使用以下样式的 ID：

id="Q-$questionNumber"
id="Q-$questionNumber-A-$answerNumber"

...其中 '$questionNumber' 和 '$answerNumber' 被替换为适当的数字。

ID 编号方案有两个作用：

• 当点击一个元素时，我的 javascript 可以检查 ID 号以找出它属于哪个问题/答案。
• 输入元素的名称遵循相同的编号方案。提交表单后，我的 PHP 代码可以通过检查名称来确定提交的值与哪个问题编号/答案编号相关联。

当然，当我拖放问题时，所有这些 ID 和名称都需要重新编号。我编写了 javascript/jQuery，它成功地重新编号并正常工作。但感觉很笨拙。

似乎我可以从所有 ID 中删除编号方案，并通过使用 jQuery 检查其在 DOM 中的位置来找出所有问题编号/答案编号。但似乎我仍然需要在输入元素名称上使用编号方案，以便我在服务器上的 PHP 代码可以判断各种提交的表单元素属于哪个问题编号/答案编号。

有没有更好的办法？

更新来自 Bankzilla 的每个请求。这是一些示例 HTML。这是一个问题。每个文档可以有很多问题，每个问题可以有很多答案。

<div id="Q-1" class="QuestionGroup ui-draggable">
    <br>
    <h2 id="QuestionText-Q-1">
        Question #1&nbsp;&nbsp;
        <input type="text" name="questionText-Q-1" value="" id="questionText-Q-1" class="questionText" maxlength="256" size="70">
    </h2>
    <div class="containerForAnswers">
        <p class="answerPar">
            <span class="answerLabel answerLabelinEditView">#1:</span>
            <input type="text" name="Q-1-A-1" value="" id="Q-1-A-1" class="answer answer-Q-1" maxlength="256" size="70">
        </p>
        <p class="answerPar">
            <span class="answerLabel answerLabelinEditView">#2:</span>
            <input type="text" name="Q-1-A-2" value="" id="Q-1-A-2" class="answer answer-Q-1" maxlength="256" size="70">
        </p>
        <p class="answerPar">
            <span class="answerLabel answerLabelinEditView">#3:</span>
            <input type="text" name="Q-1-A-3" value="" id="Q-1-A-3" class="answer answer-Q-1" maxlength="256" size="70">
        </p>
    </div>
</div>

Answer 1

不确定这是否会有所帮助，但您实际上可以在输入中使用数组。使您的案例中问题/答案的结构化变得更加容易，您不必担心编号。

<input name="Q[1][text]"/>
<input name="Q[1][answers][]" value="number 1"/>
<input name="Q[1][answers][]" value="number 2"/>

当您有多个Q[1][answers][] 时，它将像数组索引一样堆叠它们，0,1,2,3,4。

如果您将上面的内容转储出来，它会是这样的

var_dump($_POST);
array(
    'Q' => array(
        1 => (
            'text' => '',
            answers => array(
                0 => 'number 1'
                1 => 'number 2'
            )
        )
    )
)

现在，当您拖动下拉菜单时，您只需要查找问题 ID，而不是答案的顺序。

Answer 2

在研究了更多之后，我想我下次可能会尝试这样的事情：将问题编号/答案编号标识符完全排除在所有表单元素名称和 ID 之外。提交表单时，问题编号/答案编号标识符将通过 jQuery 添加到所有表单元素。这样我就不必在拖放、插入、剪切/粘贴等过程中重新编号任何问题编号/答案编号标识符。