JQUERY AJAX LOAD-TEXTBOX FOCUS

Question

我试图将文本放入DIV中，以显示DIV旁边的文本框何时关注。我没有看到那个文字

以下是jQuery脚本

<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
    <script src="../Scripts/jquery-1.11.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            //$jquery selector
            //find textbox and place it in a variable
            var txtbox = $('input[type="text"]');
            //when textbox recives focus
            txtbox.focus(function () {
                $('#newroleHelpDiv').load('help.html');
            });
            //when textbox loses focus
            txtbox.blur(function () {
                $('#newroleHelpDiv').html('');
            });
        });
    </script>

以下是ASP代码

    <fieldset style="width:350px">
            <legend> New Role</legend>
             <table>
                 <tr>
                     <td>Insert New Role:</td>
                     <td> <input type="text" id="newrole" /> </td>
                     <td> <div id="newroleHelpDiv" runat="server"></div></td>
                     </tr>
                 </table>
        </fieldset>
</asp:Content>

下面是help.html文件，帮助文本来自

<div id="newroleHelpDiv">
    You may add an employee to this role
</div>

Answer 1

id应该是唯一的，因此，如果您拥有id="newroleHelpDiv"主HTML，则应为您的help.html

使用另一个ID

不确定是否可以加载HTML文件，但是如果仅加载一次，则可以显示和隐藏：

$(document).ready(function() {
  $('#newroleHelpDiv').load('help.html');
  $('#newroleHelpDiv').hide();
  //$jquery selector
  //find textbox and place it in a variable
  var txtbox = $('input[type="text"]');
  //when textbox recives focus
  txtbox.focus(function() {
    $('#newroleHelpDiv').show();
  });
  //when textbox loses focus
  txtbox.blur(function() {
    $('#newroleHelpDiv').hide();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<fieldset style="width:350px">
  <legend> New Role</legend>
  <table>
    <tr>
      <td>Insert New Role:</td>
      <td>
        <input type="text" id="newrole" /> </td>
      <td>
        <div id="newroleHelpDiv" runat="server">You may add an employee to this role</div>
      </td>
    </tr>
  </table>
</fieldset>