0

jQuery を使用するのはこれが初めてで、達成しようとしているタスクは比較的簡単ですが、Web サイトに実装する方法を理解するのに苦労しています。

私の目標は、Web サイトの既存のテキストエリアを変更して、クライアントがテキストエリアをクリックして情報を入力すると消えるデフォルトのメッセージが表示されるようにすることです。もともとhtmlプレースホルダー属性を使いたかっただけなのですが、なぜかうまくいきません..（IE8を使用しています）。だから今、私に提案されたこのjQueryコードを使用しようとしています。

コードは次のとおりです。

                    <textarea style="background: #F6E3CE; overflow:auto;" rows="3" cols="70" name="sComments" id="sComments" 
                        <script type="text/javascript"><?php
                        $("input#text").focus(function(){
                            if( $(this).val() == "default message" )
                            {
                                $(this).val("");
                            }
                        }).blur(function(){
                            if( $(this).val() == "" )
                            {
                                $(this).val("default message");
                            }
                        }); ?>
                        </script>
                        onchange="commentsChanged(this,<?php echo $pKey;?>);"><?php echo str_replace('\r\n', "\n", rtrim($variable1[0][aComments]));?></textarea>

私の理解が正しければ、コードの冒頭で次のように jQuery ファイルを参照しました。

<script language="JavaScript" src="../js/jquery-1.6.4.js"></script>

この最新の試みでは、Web サイトのこの部分は開かれませんでした。いくつかの調査を行った後、何が間違っているのかまだわかりません。

ありがとうございました。

編集:以下の両方の回答は優れており、うまく機能します。Tenhouse のほうがロジックとフォーマットが分離されているため、より「適切」ですが、Chandrakant のインライン JavaScript の使用も同様に機能し、実際に私の Web サイトで使用したものです。

4

2 に答える 2

3

まず、コードと動作しないPHPコードを混同してJavaScriptいます。これらは直接関係がないためです。

focus / blur -listeners次に、関数に入れなければなりませんdocument ready(これは、ドキュメントがロードされたときにロードされることを意味します)。

第三に、 jQueryの基本について読むことを強くお勧めします。

編集：あなたは本当にすべてについて非常に混乱しているように見えるので、ここに完全な例があります：

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function() {
                var defaultMessage = "default message";
                $("#myTextArea").focus(function(){
                    if( $(this).val() == defaultMessage){
                        $(this).val("");
                    }
                }).blur(function(){
                    if( $(this).val() == "" ){
                        $(this).val(defaultMessage);
                    }
                }).val(defaultMessage);
            });
        </script>
    </head>
    <body>
        <textarea id="myTextArea"></textarea>
    </body>
</html>

上記の例では、新しい jQuery-Version をサーバーから直接使用していることもわかります。

Chandrakantの他の回答を見る：

JavaScript の部分を直接要素に入れることに同意しません。常にロジックとフォーマットを分割するようにする必要があるため、これは良い方法ではありません。

于 2013-02-05T14:07:41.423 に答える
1

これにjQueryを使用する必要はありません。それでもjQueryの使用に興味がある場合は、次のロジックを使用してください

  <input type="text" value="your text" onfocus="if (this.value == 'your text') {this.value = '';}" onblur="if (this.value == '') {this.value = 'your text';}">
于 2013-02-05T14:05:33.467 に答える