cfinput中的标签显示在文本框的右侧。

Question

当使用Coldfusion 9和使用HTML格式的cfform时，我将cfinput放在带有标签的页面上，它将标签显示在文本框的右侧。我试过使用标签，有和没有它，但无论我做什么，标签总是在右边的盒子。

<cfform method="post" name="mfForm" >
  <label for="campaign">Mailfile ID:</label>
  <cfinput type="text" name="campaign" id="campaign">
  <cfinput type="submit" name="submit" value="Submit" id="submit">
</cfform>

不要记得最近有过这个问题。我只想使用HTML表单，但是想要利用cf的自动建议。

Answer 1

我不想这么说，但坦率地说，这就是为什么很多人建议放弃内置的ajax特性，直接使用底层库(或一些jQuery选项)。您将有更大的控制，更多的选择，更不用说您将不会与任何版本附带的ColdFusion。这些库大多是频繁更新的，因此在一年内，那些与CF捆绑在一起的库常常过时了。ExtJS就是一个很好的例子。公共版本已经达到4.2.1，但是CF9仍然使用3.1.0。

不管怎样，回到你的问题上.如果您做了一个视图源，您将看到CF生成几个div标记，其中一个包含style="float:left"指令，它可以解释您所看到的行为。

我做了一个快速的搜索，在CF8文档中偶然发现了一条提示对日期字段进行黑客攻击的提示，它可能也适用于这里：

• 要正确显示Internet和Firefox控件旁边的标签文本，必须将标签文本包围在<div style="float:left;">标记中，并在每一行之间放置三个<br>标记。

简单地添加div似乎适用于您发布的示例：

<cfform method="post" name="mfForm" >
    <div style="float:left;">
        <label for="campaign">Mailfile ID:</label>
    </div>
    <cfinput type="text" name="campaign" id="campaign" autosuggest="AA,BBB,CCC,DDD">
    <cfinput type="submit" name="submit" value="Submit" id="submit">
</cfform>

但是，您可能需要考虑直接使用javascript库，而不是依赖内置的ajax特性，这样就可以避免像这样的怪事。