Question

我创建了一个简单的测试脚本来获取span文本的值并将值填充到输入中： http://jsfiddle.net/mujaji/8a923n0t/6/

$('.panel-body input').val($('.panel-body span').text());

$('button').click( function(){
    $('.panel-body span, .panel-body input').toggleClass('hidden');
    $('.panel-body span').text($('.panel-body input').val());
    $(this).children('i').toggleClass('glyphicon-floppy-disk');

    if ($(this).children('span').text() == "Check Out") {
        $(this).children('span').text("Save")
    }
    else {
       $(this).children('span').text("Check Out");
    }
});

这不是问题。这很好。

...但是一旦我将其实施到我的实际环境中，我就不会重新获得这些价值。两者之间存在如此明显的差异，但似乎略有不同。我没有收到任何错误，所以我猜我的语法在某处。

这是“真实世界”版本。点击“结帐”以查看其实际效果：

http://jsfiddle.net/mujaji/uL1c8owv/

$('.patient-data.stacked li input').val($(this).next('span').text());

$('.nav-tools li a').click( function(){
var valueToggle = $(this).closest('.panel-heading').next('.panel-body').children('.tab-content').children('.tab-pane.active').find('.patient-data li');
valueToggle.children('span, input').toggleClass('hidden');
valueToggle.children('span').text(valueToggle.children('input').val());

if ($(this).children('span').text() == "Check Out"){
    $(this).children('span').text("Save");
    $(this).children('i').toggleClass('fa-pencil-square-o fa-floppy-o');
}

else {
    $(this).children('span').text("Check Out");
    $(this).children('i').toggleClass('fa-pencil-square-o fa-floppy-o');
}

}）;

谁能告诉我我做错了什么？

Answer 1

Adeneo能够帮助回答我的问题。部分问题是我没有为代码的第一部分添加返回：$（'。panel-body input'）。val（）。此外，还对click事件进行了轻微调整，以便在以下内容之间切换子项：.patient-data li。

这是更新的代码以及显示修复的小提琴：

$('.patient-data.stacked li input').val(function() {
    return $(this).next('span').text();
});

$('.nav-tools li a').click( function(){
var valueToggle = $(this).closest('.panel-heading').next('.panel-body').children('.tab-content').children('.tab-pane.active').find('.patient-data li');
    valueToggle.children('span, input').toggleClass('hidden').text(function() {
        return $(this).siblings('input').val();
    });

    if ($(this).children('span').text() == "Check Out"){
        $(this).children('span').text("Save");
        $(this).children('i').toggleClass('fa-pencil-square-o fa-floppy-o');
    }

    else {
        $(this).children('span').text("Check Out");
        $(this).children('i').toggleClass('fa-pencil-square-o fa-floppy-o');
    }

});

http://jsfiddle.net/uL1c8owv/1/

Jquery切换输入/跨度值不起作用

1 个答案: