获取价值

Question

我有这样的代码：

<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); 
} 

输出是：This

这里的复选框链接到UL中的列表项目。选中/取消选中它们将隐藏/显示相应的列表项。另一件事是列表项是可编辑的。在我的代码中，它们甚至可以拖动。当我点击保存时，列表中的项目将被连接并保存在一个变量中，同时在其中进行更改。

唯一缺少的是当我隐藏一个列表项（即取消选中）时，它将shoudnt连接到变量中。例如：如果我不勾选所有项目，那么变量应该是空的。但即使全部隐藏，变量也包含所有值。

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

Answer 1

您不检查元素是否在您的action()中可见。

可以摆脱data-value属性现在也一样，我们不使用他们了

function action() { 
    var a = ''; 

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

    alert(a); 
} 

：尝试类似的信息（我简化了一些周围的代码太的自由）。

Answer 2

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

更新小提琴：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 

Answer 3

您可以使用选择这样$('li:visible')，并且只选择可见LIS

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