0

ログインが成功したときに、divを置き換えるjQueryプラグインを探しています。Google で何度も検索しましたが、必要な理想的なプラグインが見つかりません。私が探しているプラ​​グインを知っている人はいますか? 例として、私は示します:

<div class="box">
<form action="login.php" method="post">
Username:
<input type="text" name="username">
Password:
<input type="text" name="password">
<input type="submit" name="submit">
</form>
</div>

class="box" を持つ div を置き換えたいのは次のとおりです。

<div class="box" style="display: none; height: 100px;"> <p><img src="/loading.gif" alt="" align="left" /><strong>Logged in...</strong></p></div>

とにかく助けてくれてありがとう!! 注: どのボタンが html コードを投稿するだけなのかわからないため、ここにこの問題を投稿していただければ幸いです。

4

3 に答える 3

0

ajax が必要なようです。jquery.from.jsプラグインを試してみてください。Google で検索できます

于 2013-05-30T03:16:25.187 に答える
0

タグや投稿が示唆するように、本当に ajax を使用している場合は、ログインの成功時にボックス クラスのコンテンツを動的に読み込むことができます。

$('input[type="submit"]').on('click', function () {
    var formData = $('form').serialize();
    $.post('/login.php', { data: formData }, function () {
        $('.box').html('<div class="box" style="height: 100px;"> <p><img src="/loading.gif" alt="" align="left" /><strong>Logged in...&hellip;</strong></p></div>');
    });
});

更新: 私はあなたの html をコピーして貼り付けたので、あなたが挿入したいボックス html に display:none 属性を残していました。私はそれを削除し、それはうまく機能します。ここで単純化された JSFiddle を作成しました: http://jsfiddle.net/qHT3p/。実際には $.post を実行しないため単純化されていますが、機能は本質的に同じです。

于 2013-05-30T03:17:35.430 に答える
0

要素を置き換えるには user .replaceWith()

$('.box').replaceWith('<div class="box" style="display: none; height: 100px;"> <p><img src="/loading.gif" alt="" align="left" /><strong>Logged in...&hellip;</strong></p></div>')
于 2013-05-30T03:13:11.070 に答える