Javascript更新文本框中的值 [英] Javascript to update value in Textbox

查看:94
本文介绍了Javascript更新文本框中的值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述


我有一个JavaScript文件,该文件创建了一个日历选择器.该文件在整个应用程序中都已使用,并且是我必须使用的一段代码,因为我的.Net应用程序是另一个使用此JavaScript代码的应用程序的一部分.

无论如何,我可以使用日历选择器将日期保存到文本框中,但是我遇到的问题是格式.不幸的是,我无法更改日历选择器代码,因为这会影响应用程序的其他部分.因此,我想要做的是重新格式化文本框控件上的日期.只有在使用javascript事件onfocus时,我才能这样做.

现在,我的问题是,是否有JavaScript或jquery在将值输入文本框时将该值重新格式化为我想要的格式,而无需回发或单击文本框?

谢谢

解决方案

使用输入执行所需操作,请参见下面的示例,该示例读取一个文本框并将其吐回到段落innerhtml;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

    <title>Untitled Page</title>

</head>

<body>

    <p>

        Some HTML Page</p>

    <p>

        <input id="Text1" type="text" onchange ="return doFormat()" /></p>

    <p id="para1">

        &nbsp;</p>

        <script type="text/javascript">

            function doFormat() {

                var something = Text1.value;

                //Do what ever parsing and formatting then
                //spit it back out to paragraph.

                para1.innerHTML = "you entered: " + something.toString();

            }

        </script>

</body>

</html>


您使用的日历控件是否具有可以监听的OnChange事件(或类似事件)?点击事件或类似事件也可能起作用.如果更改日期/时间导致回发,则这是格式化文本框的另一种机会.如果是这样,您可以将代码放在此处进行格式化.否则,您可以创建一个计时器,每秒钟左右检查一次更改.您甚至可以隐藏该文本框,并在其位置显示您可以控制的另一个文本框.在某些情况下这会很有用,因为在文本框中设置它和更新它之间,您不会看到不正确的格式.


哦,然后还有一个主意.日历控件可以设置为回发吗?如果是这样,那么您可以使用一点AJAX魔术来更新文本框,而无需刷新整个页面.您可以将日历控件放在UpdatePanel中.发生AJAX回发时,您可以注册一个客户端脚本,该脚本将在回发返回页面时运行.在中查看有关该技术的更多信息. >

Hi
I have a javascript file, which creates a calendar picker. This file is used through out the application and is a piece of code that I have to use because my .Net application is part of another application which uses this piece of JavaScript code.

Anyhow, with the calendar picker I can save the date into a textbox, but the problem that I have is the format. Unfortunately, I cannot change the calendar picker code because this will affect other parts of the application. Therefore, what I am looking to do is to reformat the date on the textbox control. This I can do but only when I use the javascript event onfocus.

Now, my question is this, is there away in javascript or with jquery that when a value enters into a textbox that this value is then reformatted to the format I want without postback or clicking on the textbox?

Thanks

解决方案

Do what you want with the input, see the example below which reads a text box and spits it back out to a paragraphs innerhtml;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head>

    <title>Untitled Page</title>

</head>

<body>

    <p>

        Some HTML Page</p>

    <p>

        <input id="Text1" type="text" onchange ="return doFormat()" /></p>

    <p id="para1">

        &nbsp;</p>

        <script type="text/javascript">

            function doFormat() {

                var something = Text1.value;

                //Do what ever parsing and formatting then
                //spit it back out to paragraph.

                para1.innerHTML = "you entered: " + something.toString();

            }

        </script>

</body>

</html>


Does the calendar control you are using have an OnChange event (or something like that) that you can listen to? A click event or something like that may work as well. If changing the date/time causes a postback, that is another opportunity for you to format the textbox. If so, you can put your code to do the format there. Otherwise, you can create a timer that checks for changes every second or so. You might even hide the textbox and show another one that you have control over in its place. That would be useful in the case of the time, because then you wouldn''t see the incorrect format between when it gets set in the textbox and when you update it.


Oh, and one more idea. Can the calendar control be set to postback? If so, then you can use a little AJAX magic to update the textbox without refreshing the whole page. You can put the calendar control inside an UpdatePanel. When the AJAX postback occurs, you can register a client script that will run when the postback returns to the page. See more about that technique here.


这篇关于Javascript更新文本框中的值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆