将文本返回到默认状态(jQuery)

时间:2016-07-16 09:21:37

标签: jquery text back

我试图在我的文档中收集文本字段,并用不同的文本(语言)替换它。哪个没问题,但我没有重新加载页面就无法将其退回。

首先,我想要替换的所有文本字段都有名为lang="en"的属性。

所以我使用jQuery .each()函数将所有这些函数收集到一个数组中:

$(document).ready(function() {
   $("[lang=en]").each(function(){
   var textArray = $(this).text();
   });
});

变量textArray包含要用另一个变量替换的必需文本字段的集合。例如:

var replaceText = textArray.replace("Hello", "Hi").replace("Good afternoon!", "Hi!");

虽然在每个函数中我都可以$(this).text(replaceText)来应用替换文本,但我希望按下按钮(button1),而另一个按钮(button2)会将其更改回来

内部按钮onclick事件(在每个循环函数内部)$["lang=en"].text(replaceText);没有正确的效果。

1 个答案:

答案 0 :(得分:1)

<input type="button" id="convert" value="Convert"/>
<input type="button" id="convert-back" value="Convert Back"/>

#convert将转换所有具有lang=en属性的输入文件中的文本。 #convert-back按钮将执行相反的操作。让我知道它是否适合你

$(document).ready(function () {

    $("#convert").click(function () {

        $("input:lang(en)").each(function () {

            var textArray = $(this).val();
            var replaceText = textArray.replace("Hello", "Hi").replace("Good afternoon!", "Hi!");
            $(this).val(replaceText)
        });
    });

    $("#convert-back").click(function () {

        $("input:lang(en)").each(function () {

            var textArray = $(this).val();
            var replaceText = textArray.replace("Hi", "Hello").replace("Hi!", "Good afternoon!");
            $(this).val(replaceText)
        });
    });

});

修改

HTML部分

<input type="text" lang="en" value="Hello" alt="Hello, stack"/>
<input type="text" lang="en" value="Hello" alt="Hello, over"/>
<input type="text" lang="en" value="Hello" alt="Hello, flow"/>
<input type="text" lang="en" value="Hello" alt="Hello, stack"/>
<input type="text" lang="en" value="Hello" alt="Hello, over"/>

<input type="button" id="convert" value="Convert"/>

Jquery Part

$(document).ready(function () {

    $("#convert").click(function () {

        $("input:lang(en)").each(function () {

            var textArray = $(this).val();
            var newArray = $(this).attr("alt");

            $(this).val(newArray);
            $(this).attr("alt", textArray);
        });

        if ($(this).val() == "Convert") { $(this).val("Convert back"); } 

        else { $(this).val("Convert"); }
    });

});

将旧值存储到输入框的alt标记中以再次替换。如果它对您有帮助,请告诉我。