3

jsフィドル

要素の中にある をslideDownしようとしています<span>div

<div id='delete'>
    <form id='fform'> 
        <span class='front15'>Enter your name </span>

        <input type='text' id='tf' placeholder='name' />
        <input type='submit' id='get_button' value='Get' text='Get'>
    </form>
</div>

J:

 $('body').on('submit', '#fform', function () {
     $('#delete').html("<span class='front'>Processing...</span>").slideDown('slow');
     // ajax call
     return false;
 });

新しいスパンはそうではないようですslideDown。まっすぐに表示されるだけで、効果はありません

どうしたの ？

編集： 質問のタイトルが言うように：「..with text」 その点に対処する回答はありません。テキストをdivでスライドさせてください（垂直マーキーに見られるようなもの）

これは私が欲しかったものです: adeneoに感謝

フィドル

4

4 に答える 4

2

要素を非表示として追加し、下にスライドします:

$('body').on('submit','#fform',function(){ 
     var div = $('<div />', {'class': 'front', 
                                text  :'Processing...', 
                                style :'display:none;'
                              }
                );
     $('#delete').html( div );
     div.slideDown('slow');
     return false;
 });

フィドル

またslideDown()、インライン要素が適切に配置されていないと問題が発生する場合があるため、ブロック要素を使用します。

于 2013-03-28T11:22:59.260 に答える
0

新しい div は表示された状態で作成されるため、ページにすぐに表示されます。

非表示にする場合は、下にスライドできます。

$('#delete').html("<span class='front'>Processing...</span>").hide().slideDown('slow');

http://jsfiddle.net/ua2GM/

于 2013-03-28T11:19:49.290 に答える
0

滑り落ちなかった理由は、すでに見えていたからです。最初に非表示にしてから下にスライドしてみてください。

$('#delete').html("<span class='front'>Processing...</span>").hide().slideDown('slow');

デモ: http://jsfiddle.net/9SsUN/2/

于 2013-03-28T11:20:25.213 に答える
0

の内容を要素に置き換えるだけで、#deleteすぐに要素が表示されます。また、後でフォームにアクセスする場合があるため、フォームを非表示にすることをお勧めします。

これは、必要なslideDownを実現するわずかな再構築であり、フォームを非表示にするだけなので、後で再び表示できます。

この jsfiddle を参照してください: http://jsfiddle.net/z2gYZ/

于 2013-03-28T11:20:42.217 に答える