Question

由于某些原因，我编写的clear函数无法清除我的文本框，但它在另一个html文件中运行。有人可以为我找出问题吗？这项任务将于今天凌晨12:00截止，请帮忙！提前谢谢。

    <script type="text/javascript">
        window.onload = function() {
            var container = document.getElementById("projector");
            var add_img = document.getElementById("add-img");

            function Clear() {
                document.getElementById("xi").value = " ";

            }


            add_img.onclick = function check() {
                var img = document.createElement("img");
                var h = document.getElementById("xi").value;
                var w = document.getElementById("yi").value;

                img.src = 'http://www.cryptocoinsnews.com/wp-content/uploads/2013/12/bitcoin-google.jpeg';

                img.setAttribute("height", h);
                img.setAttribute("width", w);

                document.getElementById("projector").appendChild(img);
            }
            //This is my "clear textbox function" but it doesn't run？
            function Clear() {

                document.getElementById("xi").value = " ";
                document.getElementById("xi").value = " ";

            }

            //This is my "clear textbox function" but it doesn't run？

        }

    </script>

    <input type="text" id="xi" value="200">
    <input type="text" id="yi" value="200">
    <input type="button" id="add-img" value="Add Image" onclick='Clear()';>

    <div id="projector"></div>

Answer 1

您已在代码中注册了onclick-event。所以不要在html中使用onclick-property。在代码中调用Clear - 函数，如下所示：

add_img.onclick = function check() {
    var img = document.createElement("img");
    var h = document.getElementById("xi").value;
    var w = document.getElementById("yi").value;

    img.src = 'http://www.cryptocoinsnews.com/wp-content/uploads/2013/12/bitcoin-google.jpeg';

    img.setAttribute("height", h);
    img.setAttribute("width", w);

    document.getElementById("projector").appendChild(img);

    Clear();
}

删除onclick-property：

<input type="button" id="add-img" value="Add Image" />

Answer 2

首先，您有两个名为Clear的功能。

一旦点击按钮完成（在处理该功能的功能中），它可能更容易调用Clear。

最终以..

<script type="text/javascript">
    window.onload = function() {
    var container = document.getElementById("projector");
    var add_img = document.getElementById("add-img");


    add_img.onclick = function check() {
        var img = document.createElement("img");
            var h = document.getElementById("xi").value;
            var w = document.getElementById("yi").value;

            img.src = 'http://www.cryptocoinsnews.com/wp-content/uploads/2013/12/bitcoin-google.jpeg';

            img.setAttribute("height", h);
            img.setAttribute("width", w);

            document.getElementById("projector").appendChild(img);

            Clear();

        }
        //This is my "clear textbox function" but it doesn't run？
        function Clear() {
            document.getElementById("xi").value = " ";
            document.getElementById("yi").value = " ";
        }

        //This is my "clear textbox function" but it doesn't run？

    }

</script>

<input type="text" id="xi" value="200">
<input type="text" id="yi" value="200">
<input type="button" id="add-img" value="Add Image">

<div id="projector"></div>

Answer 3

您通过html为您分配Clear()功能，然后覆盖代码中的onclick 我只想将它添加到您的代码中。

像这样：

add_img.onclick = function check() {
   var img = document.createElement("img");
   var h = document.getElementById("xi").value;
   var w = document.getElementById("yi").value;

   img.src = 'http://www.cryptocoinsnews.com/wp-content/uploads/2013/12/bitcoin-google.jpeg';

   img.setAttribute("height", h);
   img.setAttribute("width", w);

   document.getElementById("projector").appendChild(img);
   Clear();
}

将其从HTML中删除：

<input type="button" id="add-img" value="Add Image">

修改：

将Clear()功能更改为此以更正拼写错误：

function Clear() {
   document.getElementById("xi").value = " ";
   document.getElementById("yi").value = " ";
}

在我的代码中清除文本框值

3 个答案: