如何在脚本标记中编写php代码?

时间:2017-02-28 17:06:50

标签: javascript php html

我正在尝试在脚本标记中编写php代码,但似乎出现了问题。 这是完整的代码:

<!DOCTYPE html>
<?php
if(isset($_GET['column-count']))
$var = $_GET['column-count']; 
?>

<html>
    <head>
        <title>Index</title>
        <script>

            function send_column_count(){
            var col_count = document.getElementById('num-cols').value;
            alert(col_count);
            document.getElementById('column-count-id').value =   col_count ;
            var temp = document.getElementById('column-count- id').value;
            alert(temp);

            <?php
                for($i = 0;$i < $var ;$i = $i+1){
                $temp = "col".$i;
            echo " <input type='text' placeholder='column- name' id='" . $temp . "' />";
                }
            ?>
            alert('Reached here');

            return true;
        }

</script>

    </head>
    <body>
        <form align="center" method="GET" action="" >
            <h1>Snippt</h1>
            <select id="num-cols" onchange="send_column_count()">
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
            </select>

            <input type="hidden" name="column-count" id="column-count-id" value="7" />
            <input type="submit" name="Submit" value="Create Table" />

        </form>
    </body>
</html>

现在控制台显示错误消息:意外的令牌&lt; 我无法理解出了什么问题!

1 个答案:

答案 0 :(得分:0)

你原来的逻辑是完全有缺陷的。您甚至不需要PHP来动态添加字段。但无论如何,我为您的应用发布了正确的版本,其工作方式与您希望的相同(使用PHP):

<!DOCTYPE html>
<?php
$var = 0;
if(isset($_GET['column-count']))
$var = $_GET['column-count']; 
?>

<html>
<head>
<title>Index</title>
<script>

        function send_column_count(){
            var col_count = document.getElementById('num-cols').value;
            alert(col_count);
            document.location.href = location.href.split('?')[0]+"?column-count="+col_count; 
        }

</script>

</head>
<body>
<?php
                for($i = 0;$i < $var ;$i = $i+1){
                    $temp = "col" . $i;
                    echo " <input type='text' placeholder='column- name' id='" . $temp . "' />";
                }
            ?>
<form align="center" method="GET" action="" >
    <h1>Snippt</h1>     
    <select id="num-cols" onchange="send_column_count()">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
        <option>5</option>
    </select>

    <input type="hidden" name="column-count" id="column-count-id" value="7" />      
    <input type="submit" name="Submit" value="Create Table" />

</form>
</body>
</html>

编辑:JS方式:

function send_col_count() {
var col_count = document.getElementById('num-cols').value;
var htmlConstructed = "";
for(i=0;i<col_count;i++) {
htmlConstructed += "<input type='text' id='col"+i+"' />";
}
document.getElementById('myCustomFields').innerHTML = htmlConstructed;
}

// and somewhere in body:

<div id="myCustomFields"></div>