Javascript 使用链接切换文本

我想在单击实际位于同一个p标记内的链接时更改p标记内的文本

示例：

var isMail = 0;
$('.switchto').click(function(evt) {
    evt.preventDefault();
    if(isMail == 0) {
        $(this).parent().html("oder doch lieber einen <a href='#' class='switchto'>Facebook Freund</a>");
        isMail = 1;
    } else {
        $(this).parent().html("oder lieber <a href='#' class='switchto'>E-Mailadresse eingeben</a>");
        isMail = 0;
    }

});

<p>oder lieber <a href="#" class="switchto">E-Mailadresse eingeben</a></p>

var isMail=0；
$（'.switchto'）。单击（函数（evt）{
evt.preventDefault（）；
如果（伊斯梅尔==0）{
$（this.parent（）.html（“oder doch lieber einen”）；
伊斯梅尔=1；
}否则{
$（this.parent（）.html（“order-lieber”）；
伊斯梅尔=0；
}
});

HTML:

var isMail = 0;
$('.switchto').click(function(evt) {
    evt.preventDefault();
    if(isMail == 0) {
        $(this).parent().html("oder doch lieber einen <a href='#' class='switchto'>Facebook Freund</a>");
        isMail = 1;
    } else {
        $(this).parent().html("oder lieber <a href='#' class='switchto'>E-Mailadresse eingeben</a>");
        isMail = 0;
    }

});

<p>oder lieber <a href="#" class="switchto">E-Mailadresse eingeben</a></p>

order lieber

---

为什么这不能正常工作？我错过什么了吗？有没有更简单的方法？谢谢

在替换父元素的html时，您正在覆盖包含原始元素的内容，因此它应该只工作一次。请尝试改用

.on（）

：

var isMail = 0;
$('body').on('click','.switchto',function(evt) {
    evt.preventDefault();
    if(isMail == 0) {
        $(this).parent().html("oder doch lieber einen <a href='#' class='switchto'>Facebook Freund</a>");
        isMail = 1;
    } else {
        $(this).parent().html("oder lieber <a href='#' class='switchto'>E-Mailadresse eingeben</a>");
        isMail = 0;
    }
});

var isMail=0；
$（'body'）。在（'click'，'上。切换到'，函数（evt）{
evt.preventDefault（）；
如果（伊斯梅尔==0）{
$（this.parent（）.html（“oder doch lieber einen”）；
伊斯梅尔=1；
}否则{
$（this.parent（）.html（“order-lieber”）；
伊斯梅尔=0；
}
});

您也可以使用此较短版本：

var isMail = 0;
var part1 = ['oder doch lieber einen','oder lieber'];
var part2 = ['Facebook Freund','E-Mailadresse eingeben'];
$('body').on('click','.switchto',function(evt) {
    evt.preventDefault();
        $(this).parent().html(part1[isMail%2]+ 
            " <a href='#' class='switchto'>"+part2[isMail%2] +"</a>");
    isMail++;
});

var isMail=0；
变量第1部分=[“奥德·多克·利伯·艾宁”，“奥德·利伯”]；
var part2=['FacebookFreund'，'E-Mailadrese-eingeben']；
$（'body'）。在（'click'，'上。切换到'，函数（evt）{
evt.preventDefault（）；
$（this）.parent（）.html（第1部分[isMail%2]+
" ");
伊斯梅尔++；
});

我想添加一个跨度：

<p><span>oder lieber </span><a href="#" class="switchto">E-Mailadresse eingeben</a></p>

---

这很有效。我会把它作为一个答案。一个问题：是否也有可能以某种方式禁用“单击”中输入字段上的功能？我有一个“自动完成”的输入，我想禁用当我点击（切换）到“电子邮件”。这可能吗？@Marek123当然可以，只需添加如下内容：

if（isMail%2）$（'yourInputSelector'）.attr（'autocomplete'，'off'）；else$（'yourInputSelector'）。removeAttr（'autocomplete'）