onclick适用于一个按钮，但不适用于'不要为别人工作

getelementbyid().onclick works for one button but doesn't work for another

本文关键字：适用于 工作 别人 不适用 一个 按钮 onclick      更新时间：2024-07-06

我的html页面中有五个按钮。我曾经用javascript创建其中四个，用html创建一个，但经过各种更改，我决定用html创建所有这些。问题是，以前我所有的按钮都工作得很好，但在更改后，以前由javascript创建的按钮就不再工作了。我对所有按钮都使用getElementById（"）.onclick=function（），但只有一个可以工作。（我只为四个按钮中的一个做了功能，因为我遇到了这个问题）

这是两个按钮的javascript。button1是一个不起作用的，我甚至尝试在函数中只使用console.log（），但它什么都没做。

        document.getElementById("button1").onclick = function(){var element = document.getElementById('presetPicker');element.value = this.value;providerManager.refreshProviders();};
        document.getElementById("DownloadXml").onclick = function (){createReport('http://192.168.0.101:8080/rest/v1/excel-reports/run/XLT_211607',verifyReport)};

这是页面的html部分

<body>
    <div id="container1">
        <header>
            <img src="http://www.jamk.fi/globalassets/tietoa-jamkista--about-jamk/materiaalit-esitteet-asiakaslehdet-ja-logot/jamkin-logot/jamk_fi--tunnus/jamkfi_tunnus_sininen_suomi.png" alt="Jamk logo" style="width:50%;height:50%;margin-left:25%;"> 
        </header>
        <div id="container2">
            <div id="textContainer">
                <h2>Fosfaattifosfori PO4-P [mg/l]</h2>
            </div>
            <div id="Graafi"></div>
            <div class="input">
                <div id="buttonContainer1">
                    <ul id="buttonList" class="timeForm">
                        <input id="button1" type="button" class="buttonGroup1" value="Previous day"
                        ><input id="button2" type="button" class="buttonGroup1" value="Previous week"
                        ><input id="button3" type="button" class="buttonGroup1" value="Previous month"
                        ><input id="button4" type="button" class="buttonGroup1" value="Previous year">
                    </ul>
                </div>
                <div id="buttonContainer2">
                    <div id="list">
                        <ul id="downloadList">
                        <input id="DownloadXml" type="button" value="Download" />
                        </ul>
                    </div>
                    <div id="download_div">
                        <img id="loading_gif" src="/modules/dashboards/web/public/359.gif" alt="Loading" style="display:block;">
                    </div>
                </div>
                <iframe id="download_frame" style="display:none;"></iframe>
            </div>
            <div class="testi">
                <select id="presetPicker" class="testi" ></select>
            </div>
            <footer>
            </footer>
        </div>
    </div>
</body>

通过在select中添加选项<option value="Previous day">Previous day</option>，您的代码可以再次工作。所以，要么这就是问题所在，要么函数providerManager.refreshProviders();（我无法检查）给你带来了问题。

你能提供一个带有示例的jsFiddle吗？我认为您是在绘制DOM元素之前加载脚本的。也许应该解析一个$（document）.ready（）。

我发现了问题。看起来代码本身没有问题，但我使用Firefox Web控制台进行调试，出于某种原因，它没有注册任何console.log（）命令。在使用浏览器控制台进行调试后，我找到了调试数据。

现在感到非常羞愧

编辑：我应该删除这个问题，还是让它留在这里，提醒每个刚开始的开发人员怀疑他们的调试工具？

相关文章：