2

twitterブートストラップフレームワークとjQueryで次の問題が発生しています：次のフォームがあります（簡略化すると、実際のフォームはcakephpのformhelperで構築され、さらに多くのクラスとIDがあります）：

<form class="form-horizontal">
  <div class="control-group">
    <label class="control-label" for="input01">Name</label>
    <div class="controls">
      <input type="text" class="input-xlarge" id="name">
      <span class="help-block">Supporting help text</span>
    </div>
  </div>
  <div class="control-group">
    <label class="control-label" for="input01">Description</label>
    <div class="controls">
      <input type="text" class="input-xlarge" id="description">
      <span class="help-block">Supporting help text</span>
    </div>
</form>

サーバー側の検証後、.errorクラスをそれぞれのコントロールグループに追加します。

たとえば、名前の検証は問題ありませんが、説明に失敗すると、説明コントロールグループはエラークラスを取得し、正しく表示されます（赤、標準のブートストラップ）。ただし、名前の入力フィールドも赤です。ソースコードを確認しましたが、名前のコントロールグループに.errorクラスがありません。私を混乱させるのは、入力フィールドだけが赤い境界線で表示され、適切なラベルタグが正しく表示されることです（デフォルトの色）。

理解を深めるためのスクリーンショットを次に示します。

私の問題

ChromeとFirefoxでチェックして、ブラウザのバグを除外できるようにします。また、chromes開発者ツールでクラスを手動で追加および削除しましたが、意図したとおりに機能しました。何故ですか？誰かがこれに対する解決策を持っていますか？

4

1 に答える 1

2

は-class（ここには表示されていません）を使用して別の内部にあり、-classはformjQueryを使用して適用され、DOMツリーのずっと上に移動し、両方の入力フィールドを含むに適用されました。div.control-grouperror.parents().control-group.errordiv

囲んでいるdivsクラスを削除すると、問題が解決しました。私は完全なコードにアクセスできたので、これは少し不公平です。:(

于 2012-08-18T19:00:44.580 に答える