对文本框强制执行大小写约束

Enforcing case constraint on textbox

本文关键字:大小写 约束 强制执行 文本      更新时间:2023-09-26

我有一个文本框,其中包含数据库中的案例设置。如果数据库设置为大写,则文本框文本应转换为大写;如果设置为正确大小写,则文本盒文本应转换成正确大小写。我在javascript的帮助下实现了这一点。

然而,我还有一个设置,即大写可更改,其中文本框文本转换为大写。但是,如果用户不想要大写,他可以更改大小写。

 <script type="text/javascript">
   function toUpper(obj) {
       var mystring = obj.value;
       var sp = mystring.split(' ');
       var wl = 0;
       var f, f1, f2, r1, r2, r;
        if (document.getElementById('<%= hdnNameStyle.ClientID %>').value == "UC") {
         mystring = mystring.toUpperCase();
         obj.value = mystring;
     }
     if (document.getElementById('<%= hdnNameStyle.ClientID %>').value == "PC") {
         var word = new Array();
         for (i = 0; i < sp.length; i++) {
             f = sp[i].substring(0,1).toUpperCase();
             r = sp[i].substring(1);
             word[i] = f + r;
         }
         newstring = word.join(' ');
         obj.value = newstring;
     }
     if (document.getElementById('<%= hdnNameStyle.ClientID %>').value == "UG") {
         mystring = mystring.toUpperCase();
         obj.value = mystring;
     }
  }

这是我尝试过的javascript,它运行良好。但是,为了进一步澄清,如果hdnNameStyle值为UG,则文本框文本将转换为大写,但如果用户不想要大写,则可以更改大小写。

如何让用户在javascript的帮助下更改案例?

谢谢,

与其更改文本本身,不如为其使用CSS类。

/* css */
.uppercase { text-decoration: uppercase }
.propercase { text-decoration: capitalize }

<!-- html -->
<p id="text">
    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
<input type="checkbox" onclick="toggleUppercase()" />

// javascript
function toggleUppercase() {
    var text = document.getElementById("text");
    if (text.className === "uppercase") {
        text.className = "propercase";
    } else {
        text.className = "uppercase";
    }
}

有了这个,你应该能够得到一个有效的解决方案。