簡單的jquery + javascript不工作：添加「.has錯誤」不工作和onclick事件沒有定義

我正在與jQuery 2.1.4和JavaScript做一個簡單的Bootstrap表單驗證。簡單的jquery + javascript不工作：添加「.has錯誤」不工作和onclick事件沒有定義

我發現了3件奇怪的事情。

我相信我的jQuery代碼在<input>元素onblur和onfocus事件工作（你可以在我的fiddle嘗試），但我不能看到.has-error類樣式。當然，我在<head>部分介紹了boostrap.css等。
<form-group>正在縮進我的段落到屏幕左側的末端，它隱藏了一部分，我必須錯誤地使用它，但我不知道爲什麼。
Cancelar按鈕不起作用。我已經嘗試<s:url value="/listaReservas.jsp" />和普通的URL像小提琴，無濟於事。 FF抱怨cancelar not defined。我可以像我一樣定義一個純Javascript函數（將Javascript與jQuery混合），或者我必須像這樣綁定它：$('#xxxId').click(function(){}); ???

謝謝大家。

2015-10-28 FaithReaper

你在CSS中引導Bootstrap 3類與Bootstrap 2混合.. – makshh

所以我試過'錯誤'並沒有用。你是這個意思？ – FaithReaper

http://getbootstrap.com/css/#forms - 查看有錯誤輸入的結構。首先 - 輸入必須具有形式控制類，其次 - 具有錯誤類必須設置爲輸入的父級。通過混合BS2和BS3我的意思是你使用類似span8等BS3不支持的類。 – makshh

.has-error有效，但您需要進行一些更改。首先，應將類添加到父節點form-group，其次，您的<input>字段應具有類form-control。該HTML看起來是這樣的：

<div class="form-group has-error"> 
    <label class="control-label" for="tarjetaId">No. Tarjeta:</label> 
    <div class="controls"> 
     <input class="input-xlarge form-control" id="tarjetaId" name="usuarioCompra.numeroTarjeta" value="" /> 
    </div> 
</div>

和JavaScript

$("#tarjetaId").blur(function(){ 
    var cuenta = $("#tarjetaId"); 
    if (cuenta.val().length != 20){ 
     cuenta.closest('.form-group').addClass("has-error"); 
     $("#comprarButtonId").prop('disabled', true); 
    } else { 
     cuenta.closest('.form-group').removeClass("has-error"); 
    } 
});

至於.form-group給你的佈局陰性切緣。您正在使用.row作爲其父項，該項也具有負邊距。所以你實際上應用了兩層負邊距。有<div class="row">是多餘的。

最後，在全球範圍內，這意味着$(document).ready()外聲明

function cancelar() { 
    window.location = "/listaReservas.jsp"; 
};

。提交按鈕的HTML應該有onclick="cancelar()"，而不是onclick="cancelar"

來源

2015-10-28 14:08:32 Griffith

不是'window.location。href'而不是'window.location'？ – ghaschel

這兩個作品。請參閱https://developer.mozilla.org/en-US/docs/Web/API/Window/location – Griffith

是的，你已經糾正了我所有的錯誤，謝謝！特別是最後一個，一直是我的神話。 '.form-control'正在工作，但是長度是'100％'。我可以縮短它嗎？我試過應用'col-lg-4'，但不起作用。 – FaithReaper

簡單的jquery + javascript不工作：添加「.has錯誤」不工作和onclick事件沒有定義

回答

相關問題