0

我有这个代码：

<div>
    john<input type="checkbox" onchange="javascript:hideshow(document.getElementById(this.value),this)" value="value1" checked="true">
    jhonny<input type="checkbox" onchange="javascript:hideshow(document.getElementById(this.value),this)" value="value2" checked="true">
    jack<input type="checkbox" onchange="javascript:hideshow(document.getElementById(this.value),this)" value="value3" checked="true">
</div>
<ul id="numeric">
    <li id="value1" data-value="info1">
        <div id="info1" contenteditable="true">john</div>
    </li>
    <li id="value2" data-value="info2">
        <div id="info2" contenteditable="true">jhonny</div>
    </li>
    <li id="value3" data-value="info3">
        <div id="info3" contenteditable="true">jack</div>
    </li>
</ul>
<input type="submit" id="send1" value="save" class="button" onclick="action()">

这个脚本：

function hideshow(e, ev) {
    if (ev.checked) {
        e.style.display = "block";
    } else {
        e.style.display = "none";
    }
}
function action() {
    var values = $('#numeric li').map(function () {
        return $(this).attr('data-value');
    });
    $lis = $("#numeric li").length;
    var n = $lis;
    var a="";
    for ($i = 0; $i < n; $i = $i + 1) 
    {
        a = (a + (document.getElementById((values[$i])).innerHTML) +". ");
    }
    alert (a);
}

输出是：这个

此处的复选框链接到 UL 中的列表项。选中/取消选中它们会隐藏/显示相应的列表项。另一件事是列表项是可编辑的。在我的代码中，它们甚至是可拖动的。当我单击保存时，列表项将与它们所做的更改一起连接并保存在一个变量中。

唯一缺少的是当我隐藏一个列表项（即取消选中它）时，它不应该在变量中连接起来。

例如：如果我取消选中所有项目，则变量应该为空。但是在这里，即使所有内容都被隐藏，变量也包含所有值。

我不知道该怎么做。谁能帮我。谢谢

4

3 回答 3

2

您没有检查元素是否在action(). 尝试类似：

function action() {
    var a = '';

    $('#numeric li:visible').each(function(index) {
        a += $.trim($(this).text()) + '. ';
    });

    alert(a);
}

（我也冒昧地简化了一些周围的代码。）

您现在也可以摆脱这些data-value属性，我们不再使用它们了。

于 2013-04-01T10:25:49.550 回答
1

试试下面...它会帮助你...

更新小提琴： http: //fiddle.jshell.net/dZ5ZC/9/

        var id = values[$i]; // Get the ID 
        var element = document.getElementById(id); // Get the Element by ID
        if (element.offsetWidth !== 0 || element.offsetHeight !== 0)  //Check the element isVisible or Not
        a = (a + (document.getElementById((values[$i])).innerHTML) +". "); // Assignt he Value to Variable
于 2013-04-01T10:27:44.203 回答
1

您可以像这样使用选择器$('li:visible')，并且只会选择可见的 LI

PS：元素 ID 应该始终是唯一的$("#numeric li")，这在某些浏览器中可能会导致很多问题，如果要对多个元素进行分组，请使用 class 而不是 id 并像这样选择它们$(".numeric li:visible")

于 2013-04-01T10:31:48.770 回答