1

我制作了以下小型 Javascript 脚本以在我的页面上启用一些表单元素：

function unHide()
{
    if($('#UserName').val() == "")
    {
        alert('Please Enter a User Name first');
    }
    else
    {
        $('#radio-choice-1').checkboxradio('enable');
        $('#radio-choice-2').checkboxradio('enable');
        $('#radio-choice-1-board').checkboxradio('enable');
        $('#radio-choice-2-board').checkboxradio('enable');
        $('#TransNum').textinput('enable'); 
        $('#UserContinue').remove();
        $('#nextButton').show();
    }
}

问题是，单击正确的按钮时不会调用它。甚至警报也没有出现。这是HTML：

<label for="UserName" style="vertical-align: top;">User Name:</label>
<input type="text" name="UserName" id="UserName" placeholder="Ex: LesniakBjEVS101" />

...

<a data-role="button" data-icon="check" data-mini="true" id="UserContinue"
    style="float:right;" onclick="javascript:unHide(); return false;">Continue...</a>

...

<section id="nextButton" hidden>
    <a href="salamanderSelect.html" data-role="button" data-icon="forward" 
             data-mini="true" style="float:right;">Next</a>
</section>

我遇到的问题是当我单击提交按钮时，绝对没有任何反应。我没有从 Javascript 中得到任何反馈，也没有任何反馈。

任何帮助将不胜感激！谢谢！

编辑：

在尝试了建议后，我仍然无法让 javascript 做任何事情。我尝试了多个浏览器，但仍然没有。

而且我昨天也刚刚完成了这项工作……也没有对代码进行任何更改

编辑2：

显然，如果我的脚本是 HTML 文件中的最后一件事，即使在标签之外，它也可以工作。

4

4 回答 4

4

虽然 onclick 不需要javascript:，但它仍然可以在许多浏览器中使用。这是您的示例的 jsfiddle：http: //jsfiddle.net/ukWcp/2/

仅javascript:在href.

虽然我建议在 firebug 或 chrome 中使用 javascript 控制台和调试器进行调试，但其他人提到使用全 javascript 解决方案进行绑定。这是可取的。

于 2012-05-01T15:41:59.250 回答
4

由于您已经在使用 jQuery，为什么不使用它来附加您的事件，而不是使用笨重的onclick属性。

<a data-role="button" data-icon="check" data-mini="true" id="UserContinue"
style="float:right;">Continue...</a>

$("#UserContinue").click(function(e) {
    if($('#UserName').val() == "") {
        alert('Please Enter a User Name first');
    }
    else {
        $('#radio-choice-1').checkboxradio('enable');
        $('#radio-choice-2').checkboxradio('enable');
        $('#radio-choice-1-board').checkboxradio('enable');
        $('#radio-choice-2-board').checkboxradio('enable');
        $('#TransNum').textinput('enable'); 
        $('#UserContinue').remove();
        $('#nextButton').show();
    }
    e.preventDefault();
});
于 2012-05-01T15:44:25.597 回答
1 
$(document).ready(function() {
    $("#UserContinue").click(function() {
        if($('#UserName').val() == "")
        {
            alert('Please Enter a User Name first');
        }
        else
        {
            $('#radio-choice-1').checkboxradio('enable');
            $('#radio-choice-2').checkboxradio('enable');
            $('#radio-choice-1-board').checkboxradio('enable');
            $('#radio-choice-2-board').checkboxradio('enable');
            $('#TransNum').textinput('enable'); 
            $('#UserContinue').remove();
            $('#nextButton').show();
        }

        return false;
    ); 
});

如果您使用的是 jQuery，为什么不完全使用它呢？如果这是您想要的，最后的 return false 会阻止单击事件继续。

编辑：

您在原始帖子中说“我遇到的问题是当我单击提交按钮时，绝对没有任何反应。我没有从 Javascript 中得到任何反馈，也没有任何反馈。”

然而，您已将点击事件附加到不完整的锚标记（它缺少 href）。那么您是否希望在单击提交按钮或单击锚标记时触发该行为？如果您希望触发器在单击提交按钮时触发，那么您需要更改 $("#UserContinue") 以引用提交按钮而不是锚标记。或者使用 .submit() 事件处理程序而不是 .click()，http: //api.jquery.com/submit/ 。

如果这不是问题，那么我建议编辑您的帖子以包含您的所有代码，并说明单击哪些元素后您期望的行为。

编辑2：

我相信您没有将 jQuery 包装在 .ready() 函数周围，请查看现在包含 .ready() 的修改后的代码片段。.ready() 确保 DOM 在使用 jQuery 之前完全加载。

于 2012-05-01T15:54:12.810 回答
1

保留您的函数并将事件处理程序添加到您的 javacript 而不是标记中：

$(document).ready(function() { 
    $('#UserContinue').click(function() { 
       unHide();
    });
});

简洁版本：

$(document).ready(function() { 
    $('#UserContinue').click(unHide);
});
于 2012-05-01T20:18:41.567 回答