0

だから私はこれに苦労してきました.私はプロのウェブデザイナーではありません. しかし、基本的には、さまざまな種類の天気の 6 つの画像があり、それらが押された/クリックされたときに、どの種類の天気がテーブルに保存されるかが必要でした。雲の写真をクリックすると、「雲」という単語が MYSQL データベースに保存されます。それが押された後、ユーザーは最終的にそこに名前と天気に関する投稿を入力し、最終的な Web ページで表示できるようになります。

したがって、私の問題は、画像にそのデータを保存する方法が完全にわからないことです。また、視聴者がさまざまな天気記事の他の投稿を表示できるようにしたいので、情報を配列に入れる必要があることはわかっています。javascipt で php を使用して情報を保存することを考えていましたが、どうすればよいかわかりません。

 <!DOCTYPE HTML>
   <html>
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   <title>WhethertheWeather.</title>

   <!--<link rel="stylesheet" type="text/css" href="demo/css/screen.css" media="all" />-->
        <script src="http://www.adrianpelletier.com/mint/?js"    type="text/javascript"></script>
        <script type="text/javascript" src="demo/scripts/jquery-1.3.2.min.js">   </script>
        <script type="text/javascript" src="demo/scripts/jquery-ui-1.7.1.custom.min.js"></script>
        <script type="text/javascript" src="demo/scripts/execute.js"></script>


<script>
function cloudy()

{
    return "<?php


$dbc=mysql_connect('asite.com','$user','$password','$db') ;

mysql_select_db('$db',$dbc);


    echo $_POST[weather];?>" 


}


</script>

<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body background="images/gradientsky.jpg"> 

<div id="logo">

WhethertheWeather.

</div>

<div id="question">

Whats your favorite weather?

</div>

<div id="weather">

<ul id="nav-reflection">
<form name="myform" method="post" action="cloudy_name.php">
    <li class="button-color-1"><a href="cloudy_name.php" id="weather[]" onclick="cloudy();" title="My fancy link"><img src="images/cloudybubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="sunny_name.php" id="weather[]" onclick="sunny();" title="My fancy link"><img src="images/sunnybubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-2"><a href="snowy_name.php"  id="weather[]" onclick="snowy();" title="My fancy link"><img src="images/snowbubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="rainy_name.php" id="weather[]" onclick="rainy();" title="My fancy link"><img src="images/rainbubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="mixy_name.php" id="weather[]" onclick="mixy();" title="My fancy link"><img src="images/mixbubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="windy_name.php" id="weather[]" onclick="windy();" title="My fancy link"><img src="images/windybubble.png" width="211" height="180" align="left"></a></li>

<input type="hidden" name="weather" value="weather" id="weather">
</form>
</ul>
</div>

</body>
</html>

これが私が今取り組んでいるコードです。

これがインデックスページです。私が持っている別の名前変数と混同しないように、名前をweatherに変更しました。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>WhethertheWeather.</title>

<!--<link rel="stylesheet" type="text/css" href="demo/css/screen.css" media="all" />-->
        <script src="http://www.adrianpelletier.com/mint/?js" type="text/javascript"></script>
        <script type="text/javascript" src="demo/scripts/jquery-1.3.2.min.js"></script>
        <script type="text/javascript" src="demo/scripts/jquery-ui-1.7.1.custom.min.js"></script>
        <script type="text/javascript" src="demo/scripts/execute.js"></script>


<script>
    function showweather(weather) {
    window.location = 'cloudy_name.php?w=' + weather;
}

</script>

<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body background="images/gradientsky.jpg"> 

<div id="logo">

WhethertheWeather.

</div>

<div id="question">

Whats your favorite weather?

</div>

<div id="weather">

<ul id="nav-reflection">
<form method="post" action="cloudy_name.php">
        <li class="button-color-1"><a href="cloudy_name.php" id="weather[]" onclick="showweather('cloudy');" title="My fancy link"><img src="images/cloudybubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="sunny_name.php" title="My fancy link"><img src="images/sunnybubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-2"><a href="snowy_name.php" title="My fancy link"><img src="images/snowbubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="snowy_name.php" title="My fancy link"><img src="images/rainbubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="mixy_name.php" title="My fancy link"><img src="images/mixbubble.png" width="211" height="180" align="left"></a></li>
    <li class="button-color-1"><a href="windy_name.php" title="My fancy link"><img src="images/windybubble.png" width="211" height="180" align="left"></a></li>

<input type="hidden" name="weather" value="none" id="myweather">
</form>
</ul>
</div>

</body>
</html>

cloudy_name.php名前を入力するページです。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>WhethertheWeather</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body background="images/cloudysky.jpg"> 

<div id="name">
First of all, what is your name?
</div>

    <form method="post" action="cloudy_story.php?w=<?php echo htmlspecialchars($_GET['weather'])?>">
            <table width="20%" border="1" align="center" cellpadding="1" cellspacing="1">

                <td width="100%"><label>Name: <input type="text"  name="name" value="<?php echo $_POST[name]; ?>"></input></label>

                    <input type="submit" value="Submit"> 


            </table>
        </form>


</body>
</html>

これが cloudy_story.php です。

<html>
    <head>
        <title>Forum</title>
    <link href="style.css" rel="stylesheet" type="text/css">
    </head>
    <body background="images/cloudysky.jpg"> 

   <div id="cloudy">
    Cloudy
    </div>
    <div id="white">
      <div id="blue">
        <div id="grey">
          <div id="container">
            <form method="post" action="cloudy_update.php?w=<?php echo htmlspecialchars($_GET['weather']); echo htmlspecialchars($_POST['name'])?>">
              <table width="800px" border="1" align="center" cellpadding="3" cellspacing="1">
                <tr>
                  <td width="800px"><h5><?php echo 'Hi, '. $_POST[name] ?>!
                  Write your story about your favorite weather. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quam urna, rutrum ut hendrerit sit amet, dictum ut dui. Cras id sem at tortor ornare porttitor at id dolor. Proin quis nulla sit amet felis tempus imperdiet eu id felis. Vivamus ac ultricies ipsum. Aliquam nec enim nec turpis mattis aliquam. Aliquam eu quam libero. Quisque vel ligula ante, ut tempor sapien. Nullam molestie elementum urna et consequat. Fusce turpis dolor, consectetur vel placerat vel, tempor vel justo. Donec odio orci, imperdiet quis varius dignissim, pulvinar id erat. Proin lectus enim, ornare tincidunt facilisis et, accumsan eget purus. Phasellus dolor mi, . </h5></td>
                </tr>
                <tr>
                  <td width="300px"><label>Story :
                    <textarea rows="10" cols="100"  name="story" ><?php echo $_POST[story]; ?></textarea>
                    </label></td>
                </tr>
                <tr>
                  <td width="300px"><input type="submit" value="Post"></td>
                </tr>
              </table>
              <input type="hidden" name="name" value="<?php echo $_POST[name]?>">
            </form>
          </div>
        </div>
      </div>
    </div>

    </body>
</html>

これは、そのすべてを更新するページ (cloudy_update.php) であり、m データベースのテーブルに配置されます。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
</head>

<body>
<?php

$dbc=mysql_connect('localsite','user','pw','db') ;
mysql_select_db('db',$dbc);

    /////////////////////////////////////////////////
    //let's insert our data into the database      //
    /////////////////////////////////////////////////


$query = "insert into stories values('" . mysql_real_escape_string($_GET['weather']) . "', '" . mysql_real_escape_string($_POST['name']) . "' , '" . mysql_real_escape_string($_POST['story']) . "')"

    or die ("Error - Couldn't register user.");

    echo "Thank you $_POST[name]! You've been successfully posted<br /><br />
        Please view all the posts <a href='view_forum.php'><b>here</b></a>.";


    /////////////////////////////////////////////////
    // finished inserting our data into the database //
    /////////////////////////////////////////////////


     exit();
 ?>

申し訳ありません...私はこれに本当に苦労しています...おそらく私が愚かすぎて見ることができない小さなもの..

4

3 に答える 3

0

まずはクールな背景。非常に素晴らしい。ヘッダーのフォントを変更する必要がありますが、あなたはそれを認識していると確信しています. ここで設定されているように、各ボタンがその天気の種類 (sunny_name.php) 用に作成された固有のページに移動するように見えます。したがって、最初のページから変数を保存する必要はありません。ただし、2 番目のページでは、sunny_name.php にあるフォームを使用して、weather 変数 + name 変数を渡すことができます。

<form action="sunny_story.php?weather=sunny" method="post">

最後に、あなたの情報を入力する 3 番目のページ (sunny_story.php) があります (ここにストーリーを追加する場合を除きます。その場合は、final_page.php?weather=sunny&name のように天候とともに名前 var を URL に保存します)。 =ジョン)。どちらを選択しても、結末は似ています。

<?php
//connect to db
$con=mysql_connect('localhost','username','pw');

if(!$con){
die('Could not connect to the db: ' .mysql_error());
}

mysql_select_db('yourdb',$con);

//enter query
$query = "INSERT INTO `table` VALUES ('".mysql_real_escape_string($_GET['weather'])."',
         '".mysql_real_escape_string($_GET['name'])."',
         '".mysql_real_escape_string($_POST['story'])."')"

$result = mysql_query($query);

注: クエリ内の値の順序は、mysql テーブル内の列の順序によって異なります。また、ストーリーの Post メソッドは、この最後のページに到達するために使用したフォーム メソッドに依存します。テストしていませんが、動作するはずです。

于 2012-04-14T21:49:16.470 に答える
0

このようにしてみてください。スタイルを追加していません。

    <!DOCTYPE HTML>
   <html>
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
   <title>WhethertheWeather.</title>

   <!--<link rel="stylesheet" type="text/css" href="demo/css/screen.css" media="all" />-->
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">   </script>


<script>
    $(document).ready(function(){
        $('#nav-reflection li a img').click(function(){
            var value = $(this).parent().attr('id');
            $('#weatherVal').val(value);
            $('#detailsDiv').slideDown();
        })
        $('#save').click(function(){
           $.post('insert.php',$("#weatherForm").serialize(), 
                function(data){
                    console.log(data);
                }
            ) 
        });
    });
</script>

<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body background="images/gradientsky.jpg"> 

<div id="logo">

WhethertheWeather.

</div>

<div id="question">

Whats your favorite weather?

</div>

<div id="weather">
<form method="post" id="weatherForm">

    <ul id="nav-reflection">
        <li class="button-color-1"><a href="javascript:void(0);" id="cloudy" title="My fancy link"><img src="images/cloudybubble.png" width="211" height="180" align="left"></a></li>
        <li class="button-color-1"><a href="javascript:void(0);" id="sunny" title="My fancy link"><img src="images/sunnybubble.png" width="211" height="180" align="left"></a></li>
        <li class="button-color-2"><a href="javascript:void(0);" id="snowy"  title="My fancy link"><img src="images/snowbubble.png" width="211" height="180" align="left"></a></li>
        <li class="button-color-1"><a href="javascript:void(0);" id="rainy" title="My fancy link"><img src="images/rainbubble.png" width="211" height="180" align="left"></a></li>
        <li class="button-color-1"><a href="javascript:void(0);" id="mixy" title="My fancy link"><img src="images/mixbubble.png" width="211" height="180" align="left"></a></li>
        <li class="button-color-1"><a href="javascript:void(0);" id="windy" title="My fancy link"><img src="images/windybubble.png" width="211" height="180" align="left"></a></li>
    </ul>
    <input type="hidden" name="weatherVal" id="weatherVal">
    <div id="detailsDiv" style="display: none;">
        <input type="text" name="name" id="name">
        <textarea type="text" name="story" id="story"></textarea>
        <input type="button" name="save" id="save" value="Save">
    </div>
</form>
</div>

</body>
</html>

jquery を使用すると、値を別のファイルにポストして、そこで DB 操作を実行できます。

<?php
    $dbc=mysql_connect('localhost','root','','test') ;
    if(!$dbc){
        die('Could not connect to the db: ' .mysql_error());
    }
    else
    {
        $query = "INSERT INTO `weather` VALUES ('','".mysql_real_escape_string($_POST['weatherVal'])."',
         '".mysql_real_escape_string($_POST['name'])."',
         '".mysql_real_escape_string($_POST['story'])."')";
        echo $query;
        $result = mysql_query($query);
        return $result;

    }
?>
于 2012-04-15T08:36:01.973 に答える
0

あなたができることの1つは、これの代わりです：

<li class="button-color-1"><a href="cloudy_name.php" id="weather[]" onclick="cloudy();" title="My fancy link"><img src="images/cloudybubble.png" width="211" height="180" align="left"></a></li>

showName()次のような適切なページにユーザーを送信する、呼び出される単一の JavaScript 関数を作成できます。

<li class="button-color-1"><a href="cloudy_name.php" id="weather[]" onclick="showName('cloudy');" title="My fancy link"><img src="images/cloudybubble.png" width="211" height="180" align="left"></a></li>

関数では、showName()次のように簡単に記述できます。

function showName(Name) {
    window.location = 'name.php?w=' + Name;
}

name.php で、action 属性を次のようにフォームに出力できます。

<form method="post" action="next.php?w=<?php echo htmlspecialchars($_GET['w'])?>">

</form>

では、次のような単純な挿入クエリを使用してnext.php、天気にアクセスして$_GET['w']名前を付け、データベースに追加できます。$_POST['name']

$query = "insert into tablename values('" . mysql_real_escape_string($_GET['w']) . "', '" . mysql_real_escape_string($_POST['name']) . "')";
于 2012-04-15T07:59:25.370 に答える