奇怪的JavaScript问题

i'm building a page that is dinamically loaded with ajax.

This is what the '$.get' jQuery function calls (this is located on an external HTML page):

<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>

And this is where the external HTML is placed...:

<div id="settings_appearance">

</div>

... from this javascript snippet:

    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');
    }

Well... the problem is that the javascript in the first snippet is executed when it's loaded by the $.get function, but i still can't understand the reason why when i type into the input boxes nothing happen. It should write the output of the javascript function check_passwords(password, password_confirm) in <td class="td_error" id="settings_security_error"></td>.

Thanks for helping. Silvio

1个回答


一个问题将是这样:</ p>

  $('#settings_security_error')。innerHTML ='密码太短';
</ code> </ pre>

$('#settings_security_error')</ code>是一个jQuery对象; 不是DOM元素。 您毫无意义地在jQuery对象上设置了 innerHTML </ code>属性; 这不会做任何有用的事情。 </ p>

如果要直接设置DOM元素 innerHTML </ code>,请执行以下任一操作:</ p>

  $('#settings_security_error')[0] .innerHTML ='密码太短';
</ code> </ pre>

或</ p>

  $('#settings_security_error')。get(0).innerHTML ='密码太短';
</ code> </ pre>

或者您可以使用jQuery .html()</ code> 或< a href =“ http://api.jquery.com/text” rel =“ nofollow noreferrer”> .text()</ code> 函数(最快的是text()):</ >

  $('#settings_security_error')。text('密码太短');
</ code> </ pre>

或</ p>

  $('#settings_security_error')。html('密码太短');
</ code> </ pre>
     </ div>

展开原文

原文

One problem will be this:

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

$('#settings_security_error') is a jQuery object; not a DOM element. You're meaninglessly setting the innerHTML property on a jQuery object; which won't do anything useful.

If you want to set the DOM elements innerHTML directly, do either:

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

Or

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

Or you can use the jQuery .html() or .text() functions (text() being the quickest):

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

Or

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

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐