1

私は最近、ユーザーが画像をアップロードできるようにする Web サイトを作成し、そのユーザーと Web サイトの他のユーザーが画像を 1 から 10 で評価できるようにしました。すべてが正しく機能しています。ユーザーが画像を評価すると、これが保存され、別のランダム ボックスが生成されてユーザーに提示されます。これは、(ランダムに生成された) 新しいボックス ID をクエリ文字列に追加することで機能します。これにより、ユーザーは今見た画像に戻ることができます。

私の問題は、ページの更新に伴います。現在、私のコードは評価を処理してデータベース内に保存し、データベースからランダムな画像 ID を見つけるためのコードがある同じページにユーザーをリダイレクトし、その ID を使用して ID を持つ同じページに再度リダイレクトします。クエリ文字列。これは正常に動作しますが、画像と画像情報 (画像名の評価など) のみが更新され、残りの HTML (ヘッダー、ナビゲーション、サイドバー、フッターなど) が更新されるようにしたいと思います。ではありません。

私の理解では、JQuery/Javascrip/AJAX を使用して Web サイトの一部をアップロードできますか? ただし、これにより、ユーザーは以前に表示した画像にリダイレクトできなくなりますか?

さらに情報が必要な場合は、お問い合わせください。

編集

私は船上でいくつかの情報を取得し、ハッシュ値を使用するようにコードを変更しました。私のコードは以下のとおりです。

HTML

<img id="design" alt="" width="300" height="300"  />
<input type="button" id="GetImage" value="Get Image" />

Jクエリ

$(document).ready(function(){

    $("#GetImage").click(function() {

        $.ajax({ //Make the Ajax Request
                 type: "POST",
                 url: "testimagelook.php", //file name
                 success: function(server_response){
                    var id = server_response;
                    document.location.hash = id;
                    $('#design').attr('src','img/boxes/'+id+'.png');
                 }
        });
    });

});

PHP ファイル testimagelook.php はデータベースに接続し、私の画像の 1 つのランダムな ID を返します。このコードは、画像を表示し、URL のハッシュに画像の ID を保存して、ユーザーの画像履歴を保存するのに問題なく機能します。ただし、ユーザーが戻るボタンをクリックしたときに、以前のハッシュ値を取得して正しい ID で画像をリロードする方法がわかりません。何か案は？

4

3 に答える 3

3

はい、jQueryAJAXメソッドを使用してこれを実現でき
ます。簡単にするためにこれを使用 してください

$.post('pageURL.php', {data1: value1}, function(result) {
  // Update the portion of the page you wish to

});

更新しました 

$.ajax({
  type: "POST",
  url: "PageName.aspx/MethodName",
  data: "{}",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function(data) {
    // Now receive the data (information) in the form of JSON
    // In this JSON you can pass the imageID or anything to proceed your logic
    // and update the portion of the page you wish to
  }
});
于 2013-02-12T12:07:32.503 に答える
1

好きなことをする方法はいくつかあります。

新しい (html5 をサポートする) ブラウザーは、履歴 (戻る/進むボタン) の場所を追加および削除するために使用できる履歴オブジェクトをクライアントに公開します。

https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history

しかし、これはまだ新しいものであり、ユーザーに新しいブラウザーの使用を強制することはできません。

「常に」機能する方法は、画像を識別するオブジェクト#yourIdの href メンバーにアンカーを追加することです。document.locationこれは、ブラウザの履歴に自動的に保存されます。この情報を使用するには、document.locationオブジェクトの変更を確実にキャッチし、Ajax リクエストを介して適切なデータで画像ビューを更新する必要があります。

于 2013-02-12T12:08:53.483 に答える
0

私は自分自身に似たものをコーディングしています。次のようなものを試すことができます：

newimage.js:

function newImage(id,rate) {
    $('.wrapper').empty();
    $.ajax({
        url:'dbfunction.php',
        type:'POST',
        data: { 'imageid': i, 'rating':rate }
    }).success(function(){
        // Using jquery append new information inside wrapper      
    });
}

dbfunction.php:

<?php
    mysql_query("UPDATE table SET rating='".$_POST['rating']."' WHERE id='".$_POST['id']."'");

    // Get new id from db
    echo json_encode($new_id);
?>

これは、開始するための非常に小さな例です。ご不明な点がございましたら、お気軽にお問い合わせください。詳細については、こちらとこちらをご覧ください。

少し明確にするために、私は自分のウェブページで同様のコードを使用しています。ページを更新するたびにすべての情報にアクセスできます。すべてのページ履歴はグローバル配列内に保存されています。Web ページは作成中であり、すべてが機能しているわけではないことに注意してください。

于 2013-02-12T12:21:14.043 に答える