自動更改表單字段中的值

我有一個網頁，用戶輸入信息（姓名，職位，地址等），並自動爲他們創建名片。我目前有一些jQuery使用.change，並在用戶更改它時查看字段。自動更改表單字段中的值

它尋找與他們輸入的內容有關的問題，因爲有些內容必須採用某種格式（例如，他們輸入單詞「Avenue」，並且不會讓他們將商品添加到購物車，直到它們更改爲大道）

我想找到一些方法來自動執行此操作與JS/jQuery，但我不知道該怎麼辦。我希望這個領域能夠自我更新，所以如果用戶放入「大道」，它會自動更新爲「Ave.」。用戶選項卡/退出該字段後。

有關JS和/或jQuery可以用來做什麼的任何想法？

這裏是我當前的代碼：

var x = "Clean"; 
var xD = "&nbsp;"; 
$('#cartText4046').change(function() { 
     if ($(this).val().indexOf("Avenue") > -1) { 
      x = "Please use Ave. instead of Avenue."; 
     } else if ($(this).val().indexOf("avenue") > -1) { 
      x = "Please use Ave. instead of Avenue."; 
     ... Additional rules here, omitted for space. 
     } else { 
      x = "Clean"; 
     } 


    if (x != "Clean") { 
     $('#cartText4046').addClass("invalid"); 
     xD = x; 
    } else if (x == "Clean") { 
     $('#cartText4046').removeClass("invalid"); 
     xD = "&nbsp;"; 
    } 

    if (x != "Clean") { 
     $('.betabutton').html('<span id="addToBaskettext">To add this to the Basket, 
     please fix the following issue(s):<br><br>&nbsp;' +xD'</span>'); 
     $('.betabutton').addClass("invalidBtn"); 
    } else if (x == "Clean") { 
     $('.betabutton').html('<a id="addToBasket" href="#" onclick="actionPageSubmit();return false;"><span id="addToBaskettext">Add to Basket</span></a>'); 
     $('.betabutton').removeClass("invalidBtn"); 
    }

來源

2014-11-03 Brett

請發表您的代碼。 – j08691 2014-11-03 19:30:10

@ j08691我沒有任何，我正在尋找什麼使用建議。我可以發佈查看該字段的代碼，以查看是否輸入了錯誤的內容，但是我試圖將其從該內容中自動刪除，因此我認爲它與該問題無關。 – Brett 2014-11-03 19:33:36

http://stackoverflow.com/tour「這個網站是關於獲取答案的，它不是一個討論論壇，也沒有閒聊。」如果你嘗試一些併發布你的結果，你會得到更好的迴應。 – mkaatman 2014-11-03 19:35:17

這裏是你可能會尋找工作示例。

$("#textbox").on("change", function() { 
    $(this).val(function(index, value) { 
     return value.replace('Avenue', 'Ave.'); 
    }); 
});

http://jsfiddle.net/decx8sw9/

來源

2014-11-03 19:36:19 White

這個工程很好，甚至接受與我一直試圖設置的js.autocorrect不同的時期。感謝你！ – Brett 2014-11-04 15:50:10

編輯：我重讀的問題，現在看到你想要的校正的用戶退出後場的情況發生。此答案在用戶輸入時提供內聯自動更正。畢竟，如果你覺得它有用，我會留下它。

您可以從jQuery Autocorrect Plugin：jsfiddle中解除代碼。

$("#textbox").autocorrect({ 
    corrections: { 
     Avenue: "Ave.", 
     "...": "someWord" 
    } 
});

來源

2014-11-03 20:08:01 mtl

這是超級有用的。謝謝。它正是我所需要的，但有一個問題（要糾正的詞不接受句點，但我試圖找到一種方法讓它接受它們） – Brett 2014-11-04 15:10:02

它會接受句點，如果你把鍵（單詞被糾正）在引號中。我已經編輯了答案來反映這一點。 – mtl 2014-11-04 16:03:30

謝謝，我發誓我試過了，但沒有奏效。 – Brett 2014-11-04 17:03:26

如果你真的想要它做它的用戶已經完成更改後（「用戶的標籤後/退出的領域。」），你可能要綁定到模糊（火災時，焦點將丟失/移動到其他元素）...

$('#cartText4046').on("blur", function() { 
$(this).val(function(index, value) { 
    value = value.replace('Avenue', 'Ave.'); 
    // keep going ... value = value.replace('Street', 'St.') .. 
    return value; 
});

來源

2014-11-04 16:29:57 Tom

感謝您的建議，但除了事件處理程序的區別之外，這與接受的答案沒有任何區別。 – Brett 2014-11-04 19:06:17

自動更改表單字段中的值

回答

相關問題