Question

我正在构建一个用ajax加载的页面。

这是'$.get' jQuery函数调用的内容（位于外部HTML页面上）：

<script type="text/javascript">
$(function()
{
    $('button').sb_animateButton();
    $('input').sb_animateInput();
    $('#settings_security_error').hide();
});

function check_passwords(password, password_confirm)
{
    $('#settings_security_error').show();
    alert('I\'m in funcion!'); // This works...
    if(password.length < 4)    // ... this doesn't
    {
        $('#settings_security_error').innerHTML = 'Password too short';
    }
    else
    {
        password = hex_md5(password);
        password_confirm = hex_md5(password_confirm);
        $.get('/engine/ajax/check_password.php?password=' + password + '$password_confirm=' + password_confirm,
              {language: "php", version: 5},
              function(result)
              {
                  $('#settings_security_error').innerHTML = result;
              },
              'html');
    }
}
</script>

<div class="title">Security</div>
<table class="sub_container">
<tr>
    <td><label>Old password</label></td>
    <td class="td_input"><input type="password" name="old_password"/></td>
</tr>
<tr>
    <td><label>New password</label></td>
    <td class="td_input"><input type="password"
                                name="new_password"
                                id="settings_security_new_password"
                                onkeyup="check_passwords(this.value, getElementById('settings_security_password_confirm').value)"/></td>
</tr>
<tr>
    <td><label>Confirm password</label></td>
    <td class="td_input"><input type="password"
                                name="new_password_confirm"
                                id="settings_security_password_confirm"
                                onkeyup="check_passwords(getElementById('settings_security_new_password').value, this.value)"/></td>
</tr>
<tr>
    <td class="td_error" id="settings_security_error"></td>
</tr>
</table>

这就是放置外部HTML的地方......：

<div id="settings_appearance">

</div>

...来自这个javascript片段：

    function get_page_content(page, target_id)
    {
        $.get('engine/ajax/get_page_content.php?page=' + page,
        null,
        function(result)
        {
            $("#"+target_id).html(result); // Or whatever you need to insert the result
        },
        'html');
    }

嗯......问题是第一个片段中的javascript是在$.get函数加载时执行的，但我仍然无法理解为什么当我输入输入框时没有发生任何事情。它应该在check_passwords(password, password_confirm)中编写javascript函数<td class="td_error" id="settings_security_error"></td>的输出。

感谢您的帮助。西尔维奥

Answer 1

一个问题是：

$('#settings_security_error').innerHTML = 'Password too short';

$('#settings_security_error')是一个jQuery对象;不是DOM元素。你无意义地在jQuery对象上设置innerHTML属性;哪个不会有用。

如果要直接设置DOM元素innerHTML，请执行以下操作：

$('#settings_security_error')[0].innerHTML = 'Password too short';

或者

$('#settings_security_error').get(0).innerHTML = 'Password too short';

或者你可以使用jQuery .html()或.text()函数（text（）是最快的）：

$('#settings_security_error').text('Password too short');

或者

$('#settings_security_error').html('Password too short');

奇怪的JavaScript问题

1 个答案: