0

以下のコードを使用して登録フォームを作成しようとしていますが、まだ初期段階です。PHP の echo ステートメント内にある JavaScript コードを実行するのに非常に苦労しています。

スラッシュ\'とを使用して JavaScript 関数内の一重引用符と二重引用符をエスケープしようと\"しましたが、これは一番上の JavaScript 関数で機能しましたが、他の 2 つの関数を追加して同じロジックを適用すると、すべての JavaScript 関数が機能しなくなりました。

問題を回避し、php の echo ステートメント内にある JavaScript コードを簡単に実行する最も簡単な方法を教えてください。

<?php

echo '
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>      
    <script type="text/javascript">
        function validateEmail(email) { 

            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

            if(re.test(email)) {
                document.getElementById(\'result\').innerHTML = \'<img src=\"http://www.customotion.com/green_check_small.png\" style=\"width:15px;\"/> Valid\';
            } else {
                document.getElementById(\'result\').innerHTML = \'<img src=\"http://biglistbigsales.com/m/templates/GPT/images/x_xMarkRed4.png\" style=\"width:15px;\"/> Invalid\';
            }
        }   

    </script>
</head>

<body>
<div id="main-container">

<div id="body-container" style="padding-bottom:150px; height:800px;">
    <div style="height:100px; margin:0px auto;">
        <img class="reg-step" style="width:100%;" src="images/step1.png">
    </div>
    <div style="margin-left:110px;">
        <span style="font-size:24px;" class="smallheading">Tell Us About Yourself</span>
        <br/><span style="font-size:13.5px;"><i>*All fields required</i></span>
    </div>

    <form method="post" action="registernew.php">
    <div style="margin:0px auto; margin-left:110px; border:1px solid blue; float:left; font-size:12px; width:500px;">
        <div style="border:1px solid blue; float:left; width:80%;">
            <div style="float:left; border:1px solid red;">
                First Name:
                <br/><input type="text" style="width:140px;" name="fname" />
            </div>

            <div style="float:right; margin-right:50px; border:1px solid red;">
                Last Name:
                <br/><input type="text" style="width:140px;" name="lname" />
            </div>
        </div>

        <div style="border:1px solid blue; float:left; margin-top:20px; width:50%;">
            <div style="float:left; border:1px solid red;">
                City:
                <br/><input type="text" style="width:170px;" name="fname" />
            </div>
            <div style="float:right; border:1px solid red;">
                State:
                <br/>';
                include('inc/statedropdown.inc.php');
echo'       </div>
        </div>
        <div style="float:left; width:100%;">
            <br/>Company Name:<br/> <input type="text" name="fname" style="width:150px;"/>
            <br/><br/>E-mail Address:<br/> e-mail:<br/><input id="email" type="text" onblur="validateEmail(this.value)" /><span id="result"></span>
            <br/><br/>Phone Number:<br/> <input type="text" name="fname" style="width:110px;" />
            <br/><br/>Password:<br/><input type="password" name="fname" />
            <br/><br/>Confirm Password:<br/><input type="password"  name="lname" />

            <br/><input type="submit" value="Next Step" style="background-color:#ebda5f; color:blue; margin:15px 0px 0px 20px;">
        </div>
    </form>
    </div>
</div>
</div>
</body>
</html>';

?>
4

1 に答える 1

4

<?php ?>タグは必要な場合にのみ使用してください。タグ内にないものはすべてエコーされ、HTML のように扱われます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>      
    <script type="text/javascript">
        function validateEmail(email) { 

            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

            if(re.test(email)) {
                document.getElementById(\'result\').innerHTML = \'<img src=\"http://www.customotion.com/green_check_small.png\" style=\"width:15px;\"/> Valid\';
            } else {
                document.getElementById(\'result\').innerHTML = \'<img src=\"http://biglistbigsales.com/m/templates/GPT/images/x_xMarkRed4.png\" style=\"width:15px;\"/> Invalid\';
            }
        }   

    </script>
</head>

<body>
<div id="main-container">

<div id="body-container" style="padding-bottom:150px; height:800px;">
    <div style="height:100px; margin:0px auto;">
        <img class="reg-step" style="width:100%;" src="images/step1.png">
    </div>
    <div style="margin-left:110px;">
        <span style="font-size:24px;" class="smallheading">Tell Us About Yourself</span>
        <br/><span style="font-size:13.5px;"><i>*All fields required</i></span>
    </div>

    <form method="post" action="registernew.php">
    <div style="margin:0px auto; margin-left:110px; border:1px solid blue; float:left; font-size:12px; width:500px;">
        <div style="border:1px solid blue; float:left; width:80%;">
            <div style="float:left; border:1px solid red;">
                First Name:
                <br/><input type="text" style="width:140px;" name="fname" />
            </div>

            <div style="float:right; margin-right:50px; border:1px solid red;">
                Last Name:
                <br/><input type="text" style="width:140px;" name="lname" />
            </div>
        </div>

        <div style="border:1px solid blue; float:left; margin-top:20px; width:50%;">
            <div style="float:left; border:1px solid red;">
                City:
                <br/><input type="text" style="width:170px;" name="fname" />
            </div>
            <div style="float:right; border:1px solid red;">
                State:
                <br/>
                <?php include('inc/statedropdown.inc.php'); ?>
            </div>
        </div>
        <div style="float:left; width:100%;">
            <br/>Company Name:<br/> <input type="text" name="fname" style="width:150px;"/>
            <br/><br/>E-mail Address:<br/> e-mail:<br/><input id="email" type="text" onblur="validateEmail(this.value)" /><span id="result"></span>
            <br/><br/>Phone Number:<br/> <input type="text" name="fname" style="width:110px;" />
            <br/><br/>Password:<br/><input type="password" name="fname" />
            <br/><br/>Confirm Password:<br/><input type="password"  name="lname" />

            <br/><input type="submit" value="Next Step" style="background-color:#ebda5f; color:blue; margin:15px 0px 0px 20px;">
        </div>
    </form>
    </div>
</div>
</div>
</body>
</html>
于 2012-07-03T01:13:36.540 に答える