0

回答がクリックされない場合、div ID「エラー」にエラーメッセージが表示される基本的な機能があります。これはうまくいきますが、背景色があり、画像がdivのスタイルを示している場合。jquery と moo ツールを使用しています。

答えが設定されるまでこのスタイルを非表示にする方法はありますか?

    <style type="text/css>

    #error {

      border: 1px solid;
      margin: 10px 0px;
      padding:15px 10px 15px 50px;
      background-repeat: no-repeat;
      background-position: 10px center;
      color: #D8000C;
      background-color: #FFBABA;
      background-image: url('../images/error.png');

    }
    </style>

    <div id="error"></div>

    <script type="text/javascript>
    function showAnswerAlert() {
        $('error').set('html', '<strong>Please select an answer above.<strong>')


    }
    function clearErrorBox() {
        $('error').set('html','');


    }
    </script>
4

3 に答える 3

3

最初はdivを非表示にし、showAnswerAlertまたは必要な場所に表示します

<div id="error" style="display:none"></div>

function showAnswerAlert() {
    $('error').set('html', '<strong>Please select an answer above.<strong>');
    $('error').show();
}

または、ドキュメントの準備ができたらエラー div を非表示にします

$(function(){
    $('error').hide();
});
于 2012-08-08T13:40:33.920 に答える
1

hide() と show() が機能しない理由は、mootools を使用していて、"hide()" と "show()" を使用したい場合、これらの ase jQuery 関数が次のように関数を記述する必要があるためです。

window.addEvent('domready', function() {
    Element.implement({
  //implement show
    show: function() {
      this.setStyle('display','');
    },
    hide: function() {
      this.setStyle('display','none');
    }
  });
});

または、これを実行して次を表示できます。

$('error').setStyle('display','block');

そしてこれを非表示にします：

$('error').setStyle('display','none');
于 2012-08-14T01:19:26.507 に答える
0

これは選択項目の検証のようです。検証はさまざまな方法で行うことができますが、HTML5 検証を参照することをお勧めします。必要なのはこれだけかもしれません。

http://diveintohtml5.info/forms.html

于 2012-08-08T13:42:32.983 に答える