how to get input value from sharepoint people editor textbox(not checked value) via js?

I'm meeting a problem with getting input value from sharepoint people editor via js.

usually, we can get value from this control via below codes:

 var user;
    var pe = document.getElementById('<%=peStaffAccount.ClientID %>').getElementsB开发者_JAVA技巧yTagName('div');
    var i;
    var peopleEnt;
    for (i in pe) {
        if (pe[i].id != null) {
            if (pe[i].id == 'divEntityData' && pe[i].description != null) {
                peopleEnt = pe[i]
            }
        }

    }
// this is the value from this textbox but only after we click checked user
alert(peopleEnt .description)

my question is, when i input some value into this textbox directly, how can I get this value? refer to below image, my input value.. I want to get this...

Working with people picker in javascript is pretty awful. The actual control that you type into is really a content editable div. It will have an ID which is the ID of your control followed by _upLevelDiv. You will need to grab that and then parse what is within.

The code you posted is actually dealing with the nested divs created when an entity is resolved. These divs are contained within upLevelDiv.

If you only have text in the control as shown in your screenshot, then it's pretty straightforward. If you have a mix of text and resolved entities then it's more complicated as there will be both text and html in the div.

NOTE: All of the above is only true for IE, in other browsers it uses a textarea (which is hidden when in IE).

I am not sure if I have understood the question properly.

You can bind KeyPress Event to the textbox, so that you can get the text real time while typing before clicking checked user button.

    yourTextField.onKeyPress = function(){
          var txt = yourTextField.value;
    }

Use the following to investigate the rendered page:

1. Use 'View Source' to make sure that getElementById('<%=peStaffAccount.ClientID %>') is correctly substituted by the server with a valid ClientID.

2. Use the browser's debugger (F12 in IE9, Developer tools in Chrome) to inspect the DOM for the existence of the element by that ClientID

3. Using the same tools, watch for any script error reported by the debugging tools (which are otherwise silently ignored by the browsers).