从PHP调用JS函数时无法捕获输入ID

时间:2016-11-13 00:38:56

标签: javascript php jquery html

我不知道为什么,但JavaScript无法吸引我的意见:

Mensaje: <input id="mensaje" type="text" name="mensaje" value="" style="width:30%;" placeholder="Escribe un mensaje a enviar...."/>

构建为当我提交PHP检测它并调用JS函数时:

function ClearFields() {
    var e = document.getElementById("mensaje");
    e.value='';
}

我的表单永远不会重新加载页面,我可以提交文本而无需重新加载。问题是始终保留文本框的值。这就是为什么我尝试使用JavaScript,以便在提交时清除此文本框。

我在JS控制台中遇到此错误:

(index):24 Uncaught TypeError: Cannot set property 'value' of null(…)

完整代码:

<html>

<head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine">

    <title>Chat de SL</title>
    <link rel="icon" href="favicon.ico" type="image/x-icon">
    <script type="text/javascript">
        $(document).ready(function() {
            rsdfsdfsd();
            asd();
        });

        function rsdfsdfsd() {
            $('#nax').load('./funcionmensaje.php');
            setTimeout(rsdfsdfsd, 200);
        }

        function ClearFields() {
            var e = document.getElementById("mensaje");
            e.value = '';
        }
    </script>
    <script>
        var contador = 0;

        function asd() {
            if (contador < 2) {
                contador++;
                var elem = document.getElementById('nax');
                elem.scrollTop = elem.scrollHeight;
                setTimeout(asd, 100);
            }
        }
    </script>
    <script>
    </script>
</head>

<body>
    <?php
    if(isset($_POST['subname'])) {
                echo '<script>',
                'ClearFields();',
                '</script>'
                ;

        if ($_POST['mensaje'] == "") {

        }
        else {
                file_put_contents('mensajeaenviar', $_POST['mensaje']);
                file_put_contents('var', '0'); 
                $fp = fopen('mensaje.php', 'a');
                $mensaje = $_POST['mensaje'].PHP_EOL;
                fwrite($fp, 'Tú: '.$mensaje .'<br>');
            }
        }
    ?>
        <fieldset>
            <font color="#c50000">Lugar:</font> Attached |
            <font color="#c50000">Avatares cercanos:</font>

        </fieldset>

        <fieldset>
            <legend>Chat</legend>

            <td>
                <div id="nax" style="height:70%; overflow:auto">

                </div>
            </td>
        </fieldset>
        <style>
            nax {
                font-family: 'Open Sans', serif;
                font-size: 18px;
            }

            fieldset {
                font-family: sans-serif;
                border-radius: 10px;
                background: #eee;
                margin: 20px;
                padding: 20px;
                box-shadow: 0 0 10px rgba(0, 0, 0, .3);
                position: relative;
                border: 2px groove threedface;
            }

            legend {
                position: absolute;
                top: -2px;
                background: #fff;
                padding: 10px 20px;
                border: 2px groove threedface;
                border-top: none;
                box-shadow: inset 0 -5px 5px rgba(0, 0, 0, .2);
                text-shadow: 1px 1px 2px rgba(0, 0, 0, .3);
                font-weight: bold;
            }

            legend span {
                display: block;
                margin: -20px;
                background: #fff;
                padding: 0px 20px;
            }

            footer {
                font-family: sans-serif;
                margin-top: 2%;
                background: #ddd;
                border-radius: 5px;
                padding: 15px;
            }

            iframe {
                display: none;
            }
        </style>

        <fieldset style="margin-top:10px;height:3%;">
            <form id="formulario" method="post" target="tar">
                Mensaje: <input id="mensaje" type="text" name="mensaje" value="" style="width:30%;" placeholder="Escribe un mensaje a enviar...." />
                <input type='submit' value='Enviar' name='subname' />

            </form>
        </fieldset>
        <iframe name="tar" src="localhost/a.php">
    </iframe>

</body>
<footer>EnriqueGF Utilities</footer>

</html>

1 个答案:

答案 0 :(得分:0)

您发布到iframe,正如您所说,页面未重新加载,因此ClearFields函数不会在提交时执行。在表单中添加一个onsubmit处理程序,并从中调用ClearFields。