<script type="text/javascript">

   function PeoplePicker() {
　　　　 var siteCollUrl = _spPageContextInfo.siteAbsoluteUrl;

        var searchString = $("#txtPeoplePicker").val();

        var sDialogUrl = siteCollUrl + '/_layouts/15/Picker.aspx'

            + '?MultiSelect=False'

            + '&CustomProperty=User,SecGroup,SPGroup;;15;;;False'

            + '&EntitySeparator=;'

            + '&DialogTitle=Select People and Groups'

            + '&DialogImage=' + siteCollUrl + '/_layouts/15/images/ppeople.gif'

            + '&PickerDialogType=Microsoft.SharePoint.WebControls.PeoplePickerDialog, Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c'

            + '&DefaultSearch=' + escapeProperly(searchString);

        var dialogWidth = 575;

        var dialogHeight = 500;

        var options = { title: "选择用户", width: dialogWidth, height: dialogHeight, resizeable: true, url: sDialogUrl, dialogReturnValueCallback: DelegatePeoplePickerCallback };

        var rv = EnsureScriptParams("SP.UI.Dialog.js", "SP.UI.ModalDialog.showModalDialog", options);

    }

    function DelegatePeoplePickerCallback(dialogResult, xmlResult) {

        if (dialogResult > 0) {

            var $xml = $(xmlResult);

            var fqn = $xml.find('Entity').attr('DisplayText');

            $("#txtPeoplePicker").val(fqn);

            $("#txtPeoplePicker").focus();

        }

        return;

    }

</script>

<div class="input-group">

    <input id="txtPeoplePicker" type="text" />

    <span>

        <a onclick="PeoplePicker(); return false;" href="javascript:" >

            <img title="参照" alt="参照" src="/sites/xxx/_layouts/15/images/addressbook.gif">

        </a>

    </span>

</div>