私の現在のプロジェクトでは、ユーザーが編集中の[変更を保存]をクリックすると、ページのさらに下にある編集ボックスや保存されたテキストなどがポップアップ表示されます。[編集]をクリックした場所に自動スクロールして戻すために、サイトにページの場所を保持させる方法はありますか?
理想的には、ページをリロードする必要がないタイプのソリューションがありますが、その方法がわかりません(笑)。
私のサイトはPHPでコーディングされています。
ありがとう
私の現在のプロジェクトでは、ユーザーが編集中の[変更を保存]をクリックすると、ページのさらに下にある編集ボックスや保存されたテキストなどがポップアップ表示されます。[編集]をクリックした場所に自動スクロールして戻すために、サイトにページの場所を保持させる方法はありますか?
理想的には、ページをリロードする必要がないタイプのソリューションがありますが、その方法がわかりません(笑)。
私のサイトはPHPでコーディングされています。
ありがとう
Html には、(#) を使用してページを配置する機能が 1 つあります。
たとえば、[編集] ボタンが存在する次のシナリオを検討してください。
<div id="editButton">
<input type="button" name="Edit" value ="Edit"/>
</div>
あなたのページ名が "index.php" で、次の URL でリダイレクトする場合: "index.php#editButton" あなたのページは、それほど努力しなくても自動的にそのセクションにスクロールします。
要素の ID を識別し、その位置までスクロールを配置します。
乾杯
AJAX を介してフォームを保存する方法については、いくつかのチュートリアルを参照してください。これは、ページを POST していないことを意味するため、ページが更新されず、ユーザーがページ上の位置を失うことはありません。
http://www.jstiles.com/Blog/How-To-Submit-a-Form-with-jQuery-and-AJAX
http://www.devblog.co/easy-jquery-ajax-php-contact-form /
フォーム アクションに ID セレクターの名前を入れただけです。
<form class="form-horizontal" method="post" action="#regform">
そして、それは私のために働きます。
1 つのページに複数のフォームがある場合はname
、そのフォームの属性をリンクに追加できます。例えば
<form name="my-form1" action="form.php#my-form1">
これでうまくいくはずです。
もう 1 つの方法は、Ajax の使用を検討することです。そのため、ページをまったくリロードする必要はありません。または、フォームの送信時に呼び出され、非表示の入力に現在のページ位置を追加する javasscript 関数を作成することもできます。ページのリロード後、その非表示の入力の値を使用して元の位置にスクロールできます。
はい、そのアプローチは良いことです。
完全なリダイレクトではなく、データのチャンクのみを送信し、それに応じてアップロードする必要があります。
これには、 http://www.w3schools.com/ajax/default.ASPが必要です。
次に、jQuery を学びます (CSS の id とクラスに精通していることを願っています)...
http://api.jquery.com/jQuery.ajax/
涼しい?
はい、Ajax を使用してページを部分的に更新します。これは、どの Web テクノロジーでも行う方法です。