TextBox + MVC3에서 스페이스 바를 비활성화하는 자바 스크립트

이상한, 무엇이 잘못 되었나요? 감사합니다TextBox + MVC3에서 스페이스 바를 비활성화하는 자바 스크립트

소스

<link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" /> 
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery-ui.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>

가 최신이 아니기 때문에 내가 하나를 놓치거나나요?

스크립트

$(document).ready(function(){ 
    $(".Search").keydown(function(event) { 
     if (event.keyCode == 32) { 
      event.preventDefault(); 
     } 
    }); 
});

보기

<?xml version="1.0" ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-16" /> 
    <title>@ViewBag.Title</title> 
    <link rel="stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/reset.css")" /> 
    <!-- RESET --> 
    <link rel="stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/main.css")" /> 
    <!-- MAIN STYLE SHEET --> 
    <link rel="stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/2col.css")" title="2col" /> 
    <!-- DEFAULT: 2 COLUMNS --> 
    <link rel="alternate stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/1col.css")" title="1col" /> 
    <!-- ALTERNATE: 1 COLUMN --> 
    <link rel="stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/style.css")" /> 
    <!-- GRAPHIC THEME --> 
    <link rel="stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/mystyle.css")" /> 
    <!-- WRITE YOUR CSS CODE HERE --> 
    <!--[if lte IE 6]><link rel="stylesheet" media="screen,projection" type="text/css" href="@Url.Content("~/Content/newKaizen/css/main-ie6.css")" /><![endif]--> 
    <!-- MSIE6 --> 
    <link href="@Url.Content("~/Content/themes/base/jquery-ui.css")" rel="stylesheet" type="text/css" /> 
    <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery-ui.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/EditorHookup.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery.ui.datepicker.validation.js")" type="text/javascript"></script> 
    <script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script> 
    <!--<script src="@Url.Content("~/Scripts/RangeDateValidator.js")" type="text/javascript"></script>--> 
    <script type="text/javascript"> 
     $(document).ready(function() {  
      $(".appt_date").datepicker({ 
       gotoCurrent: true, 
       dateFormat: 'dd/mm/yy', 
       minDate: 0, 
       numberOfMonths: 2 
      }); 
     }); 


    $(function() { 
     var dates = $("#StartDate, #EndDate").datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      numberOfMonths: 2, 
      minDate:0, 
      onSelect: function(selectedDate) { 
       var option = this.id == "StartDate" ? "minDate" : "maxDate", 
        instance = $(this).data("datepicker"), 
        date = $.datepicker.parseDate(
         instance.settings.dateFormat || 
         $.datepicker._defaults.dateFormat, 
         selectedDate, instance.settings); 
       dates.not(this).datepicker("option", option, date); 
      } 
     }); 
}); 

$(document).ready(function(){ 
    $(".Search").keydown(function(event) { 
     if (event.keyCode == 32) { 
      event.preventDefault(); 
     } 
    }); 
}); 

    </script> 
</head> 
<body> 
    <div id="main"> 
     <!-- Tray --> 
     <div id="tray" class="box"> 
      <p class="f-left box"> 
      </p> 
      <p class="f-right"> 
       User: <strong><a href="#">@Context.User.Identity.Name</a></strong> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 
       <strong><a href="@Url.Action("LogOff", "Account")" id="logout">Log out</a></strong></p> 
     </div> 
     <!-- /tray --> 
     <hr class="noscreen" /> 
     <!-- Menu --> 
     <div id="menu" class="box"> 
      <ul class="box"> 
       <h3 style="color: #fff; font-size: 1.5em;"> 
        Memory Clinic Management System</h3> 
      </ul> 
     </div> 
     <!-- /header --> 
     <hr class="noscreen" /> 
     <!-- Columns --> 
     <div id="cols" class="box"> 
      <!-- Aside (Left Column) --> 
      <div id="aside" class="box"> 
       <div class="padding box"> 
        <!-- Logo (Max. width = 200px) --> 
        <p id="logo"> 
         <a href="@Url.Action("Index", "Patient")"> 
          <img src="@Url.Content("~/Content/newKaizen/design/logo.jpg")" alt="KTPH logo" title="Visit Site" /></a></p> 
        @if (@Context.User.Identity.Name == "admin") 
        { 
         <!-- Search --> 
         <form action="#" method="get" id="search"> 
         <fieldset> 
          <legend>Search</legend> 
          <p>@Html.TextBox("SearchString", "", new { @class = "Search" })</p> 
          <br /> 
          <input type="submit" value="Search" class="input-submit-02" /><br /> 
         </fieldset> 
         </form> 

         <!-- Create a new patient --> 
         <p id="btn-create" class="box"> 
          <a href="@Url.Action("Create", "Patient")"><span>Add new Patient</span></a></p> 
        } 
       </div> 
       <!-- /padding --> 
       <ul class="box"> 
        @if (IsSectionDefined("PatientsManagement")) 
        { 
         @RenderSection("PatientsManagement") 
         <li id="submenu-active"><a href="@Url.Action("Index", "Patient")">Patients Management</a> 
          <ul> 
           <li>@Html.ActionLink("View All Patients", "Index", "Patient")</li> 
           <li>@Html.ActionLink("Appointments", "Index", "Appointment")</li> 
          </ul> 
         </li> 
        } 
        else 
        { 
         <li id="submenu-nonactive"><a href="@Url.Action("Index", "Patient")">Patients Management</a> 
          <ul> 
           <li>@Html.ActionLink("View All Patients", "Index", "Patient")</li> 
           <li>@Html.ActionLink("Appointments", "Index", "Appointment")</li> 
          </ul> 
         </li> 
        } 
        @if (IsSectionDefined("FormsManagement")) 
        { 
         @RenderSection("FormsManagement") 
         <li id="submenu-active"><a href="@Url.Action("CGSIndex", "Test")">Forms Management</a> 
          <ul> 
           <li>@Html.ActionLink("Caregiver Survey", "CGSIndex", "Test")</li> 
           <li>@Html.ActionLink("Patient Assessment", "PAIndex", "Test")</li> 
           <li>@Html.ActionLink("Generate Forms", "Generate", "Survey")</li> 
          </ul> 
         </li> 
        } 
        else 
        { 
         <li id="submenu-nonactive"><a href="@Url.Action("CGSIndex", "Test")">Forms Management</a> 
          <ul> 
           <li>@Html.ActionLink("Caregiver Survey", "CGSIndex", "Test")</li> 
           <li>@Html.ActionLink("Patient Assessment", "PAIndex", "Test")</li> 
           <li>@Html.ActionLink("Generate Forms", "Generate", "Survey")</li> 
          </ul> 
         </li> 
        } 
        @if (IsSectionDefined("ReportsAnalytics")) 
        { 
         @RenderSection("ReportsAnalytics") 
         <li id="submenu-active"><a href="#">Reports & Analytics</a> 
          <ul> 
           <li><a href="#">Consultation Respository</a></li> 
           <li><a href="#">Generate Reports</a></li> 
          </ul> 
         </li> 
        } 
        else 
        { 
         <li id="submenu-nonactive"><a href="#">Reports & Analytics</a> 
          <ul> 
           <li><a href="#">Consultation Respository</a></li> 
           <li><a href="#">Generate Reports</a></li> 
          </ul> 
         </li> 
        } 
       </ul> 
      </div> 
      <!-- /aside --> 
      <hr class="noscreen" /> 
      <!-- Content (Right Column) --> 
      <div id="content" class="box"> 
       @RenderBody() 
      </div> 
      <!-- /content --> 
     </div> 
     <!-- /cols --> 
     <hr class="noscreen" /> 
     <!-- Footer --> 
     <div id="footer" class="box"> 
      <p class="f-left"> 
       </p> 
     </div> 
     <!-- /footer --> 
    </div> 
    <!-- /main --> 
</body> 
</html>

마크 업

<input class="Search" id="SearchString" name="SearchString" type="text" value="   " />

자원 Jquery Disable Spacebar

출처

2012-03-07 aHaH

도우미에서 생성 된 마크 업을 붙여 넣을 수 있습니까? – Eli

알림을 주셔서 감사합니다 – aHaH

코드에 눈에 띄게 이상한 점이 없습니다. 이 마크 업은 AJAX 요청에서 온 것이 아닙니다. 맞습니까? – Eli

사용하여 코드를 다시 작성하십시오 (코드는 몇 가지 문제가 아래)

<script type="text/javascript"> 
     $(document).ready(function() {  
      $(".appt_date").datepicker({ 
       gotoCurrent: true, 
       dateFormat: 'dd/mm/yy', 
       minDate: 0, 
       numberOfMonths: 2 
      }); 
     }); 


    $(function() { 
     var dates = $("#StartDate, #EndDate").datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      numberOfMonths: 2, 
      minDate:0, 
      onSelect: function(selectedDate) { 
       var option = this.id == "StartDate" ? "minDate" : "maxDate", 
        instance = $(this).data("datepicker"), 
        date = $.datepicker.parseDate(
         instance.settings.dateFormat || 
         $.datepicker._defaults.dateFormat, 
         selectedDate, instance.settings); 
       dates.not(this).datepicker("option", option, date); 
      } 
     }); 
}); 

$(document).ready(function(){ 
    $(".Search").keydown(function(event) { 
     if (event.keyCode == 32) { 
      event.preventDefault(); 
     } 
    }); 
}); 

    </script>

하십시오 단 하나 개의 준비 기능의 모든 자바 스크립트. 코드를 아래 코드로 다시 작성하십시오.

$(function() { 
     var dates = $("#StartDate, #EndDate").datepicker({ 
      defaultDate: "+1w", 
      changeMonth: true, 
      numberOfMonths: 2, 
      minDate:0, 
      onSelect: function(selectedDate) { 
       var option = this.id == "StartDate" ? "minDate" : "maxDate", 
        instance = $(this).data("datepicker"), 
        date = $.datepicker.parseDate(
         instance.settings.dateFormat || 
         $.datepicker._defaults.dateFormat, 
         selectedDate, instance.settings); 
       dates.not(this).datepicker("option", option, date); 
      } 
     }); 

$(".Search").keydown(function(event) { 
     if (event.keyCode == 32) { 
      event.preventDefault(); 
     } 
    }); 

$(".appt_date").datepicker({ 
       gotoCurrent: true, 
       dateFormat: 'dd/mm/yy', 
       minDate: 0, 
       numberOfMonths: 2 
      }); 

});

출처

2012-03-08 08:55:17

OMG 고맙습니다. 수면 순간이었습니다! – aHaH

수 당신은 준비 기능에 문제가 다음 코드

$(document).ready(function(){ 
    $("#SearchString").keydown(function(event) { 
     if (event.keyCode == 32) { 
      event.preventDefault(); 
     } 
    }); 
});

출처

2012-03-07 05:16:32

어쨌든 위의 나던 작동하지만 어쨌든 덕분에 처음으로 그것을 다시 쓴다 – aHaH

@aHah ... 전체 cshtml 페이지 코드를 여기 좋겠습니까. 다른 자바 스크립트 오류 이 문제가 발생할 수 있습니다. –

전체 페이지를 추가했습니다. 정말 도움이 필요합니다. h 예, 이것으로 하루 종일 붙어 있습니다 ... – aHaH

TextBox + MVC3에서 스페이스 바를 비활성화하는 자바 스크립트

답변

관련 문제