0

この質問はあなたに考えさせます:D. 機能が多すぎるように見えるため、HTML入力フォームがあります。1 つの関数が存在するため、Enter キーを押すとデータが送信されます。特定のキーワードが入力されているかどうかを確認して、人々を他の URL にリダイレクトできるようにする他の機能があります。それはすべて、スタックオーバーフローの人々にとって完全に機能します。これが私のコードです:

<script type="text/javascript"> 
<!-- 
function enter(e){ 
    if(e.keyCode == 13) 
    { 
        Login(); 
        return false; 
    } 
} 
//--> 
</script> 


    <script type="text/JavaScript"> 
     <!-- 
     function Login(){ 
     var keyword=document.getElementById("address").value; 
     var done=0; 
     keyword=keyword.toLowerCase(); 
     keyword=keyword.split(' ').join(''); 
     if (keyword=="example,example") { window.location="http://www.example.com"; done=1;} 
     if (keyword=="example1") { window.location="http://www.example1.com"; done=1;} 
     if (keyword=="example2") { window.location="http://www.example2"; done=1;} 
     if (done==0) { doSomethingElse(); } 
     } 
     //--> 
     </script>  

    <form name="enterkeyword" action="none"> 
        <input name="keyword" id="address" type="text" onkeypress="return enter(event);"/> 
        <div class="buttons"> 
        <button type="button" onclick="Login()">Submit</button> 
        </div> 
        </form> 

ここが問題です。送信されたすべてのクエリを Excel または .CSV に保存する方法を見つける必要があります。PHP を使用して、入力データを .CSV ファイルに保存する方法を見つけました。私はそれをテストし、それは動作します。しかし、入力フォームの既存の関数でそれを実装しようとすると、すべてが台無しになります。「クエリ保存機能」のコードは次のとおりです。これは HTML 部分です。

<html>
<head>
    <title>My Form</title>
</head>

<body>
    <form action="save.php" method="post">
        <p>
            What is your favorite movie?<br>
            <input type="text" name="formMovie" maxlength="50" value="<?=$varMovie;?>" />
        </p>
        <p>
            What is your name?<br>
            <input type="text" name="formName" maxlength="50" value="<?=$varName;?>" />
        </p>                
        <input type="submit" name="formSubmit" value="Submit" />
    </form>
</body>
</html>

これは PHP の部分 (save.php) です。

<?php
if($_POST['formSubmit'] == "Submit")
{
    $errorMessage = "";

    if(empty($_POST['formMovie']))
    {
        $errorMessage .= "<li>You forgot to enter a movie!</li>";
    }
    if(empty($_POST['formName']))
    {
        $errorMessage .= "<li>You forgot to enter a name!</li>";
    }

    $varMovie = $_POST['formMovie'];
    $varName = $_POST['formName'];

    if(empty($errorMessage)) 
    {
        $fs = fopen("mydata.csv","a");
        fwrite($fs,$varName . ", " . $varMovie . "\n");
        fclose($fs);

        exit;
    }
}
?>

    <?php
        if(!empty($errorMessage)) 
        {
            echo("<p>There was an error with your form:</p>\n");
            echo("<ul>" . $errorMessage . "</ul>\n");
        } 
    ?>

両方のコードはうまく機能しますが、それらを実装する方法がわからないので、同じフォームで連携できます...ところで、このPHP関数には2つの入力フィールドがあり、1つしか必要ありません。フィールドが残っている場合、このエラーメッセージは本当に必要ありません空...複雑なのはわかっていますが、私よりもこれをよく理解している人が助けてくれますか?

4

1 に答える 1

1

完全なアップデート

繰り返しになりますが、機能を分離し、コードを読みやすく保守しやすくしました。

索引.html

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" href="styles/index.css"/>
    </head>
    <body>
        <input type="text" id="txt" value="example1"/><br/>
        <input type="button" id="btn" value="doQuery()"/>

        <script src="scripts/index.js"></script>
    </body>
</html>

Index.js

function processValue() {

    var inputText = document.getElementById("txt").value.toLowerCase().split(' ').join('');

    // Export query
    exportQuery( inputText );
}

function exportQuery( query ) {

    var script = document.createElement("SCRIPT");

    script.setAttribute( 'type', 'text/javascript' );
    script.setAttribute( 'src', 'exportQuery.php?query=' + query );

    document.head.appendChild( script );
}

var urlMapper = {

    "example,example": "http://www.example.com",
    "example1": "http://www.example1.com",
    "example2": "http://www.example2.com"
}

/**
 * Should be called when the PHP has finished execution
 */
function onPhpReady( query ) {

    var url = urlMapper[ query ];

    if( url !== undefined ) {

        goToUrl( url );

    } else {

        codeAddress();
    }
}

function goToUrl( url ) {

    window.location = url;
}

function codeAddress() {

    alert( "Access Denied" );
}

( function() {

    // Selfexecuting code.

    function addButtonClickListener() {

        var btn = document.getElementById("btn");

        btn.addEventListener( "click", processValue, false );
    }

    function processKeyPress( e ) {

        if( e.keyCode == 13 ) {

            processValue();
        }
    }

    function addInputKeyPressListener() {

        var input = document.getElementById("txt");

        input.addEventListener( "keypress", processKeyPress, false );
    }

    addButtonClickListener();
    addInputKeyPressListener();

}() );

exportQuery.php

<?php
    // Get the request
    $query = $_GET['query'];

    if( !empty( $query ) ) 
    {
        writeToCSV( $query );
        notifyReady( $query );
    }

    function writeToCSV( $query ) {

        $fs = fopen( "storedQueries.csv", "a" );

        fwrite( $fs, $query . "\n" );

        fclose( $fs );
    }

    function notifyReady( $query ) {

        // print back as plain javascript
        print <<<ENDLINE
        onPhpReady( '$query' )
ENDLINE;
        // The ENDLINE ^ can't use spaces or it will give a parse error.
    }
?>

ソース:ダニウェブ

Webkit をターゲットにしたので、互換性のためにイベントの添付方法などを変更する必要があることに注意してください。

于 2012-10-16T11:52:36.333 に答える