2

我正在<div>用 php 创建一个表示 sql 中的表行的表。美好的。然后我使用 javascript 函数来测试 div 的值（位置、宽度等）。很好。但我需要将另一个值传递给 div 以由函数检查。它在数据库中，但我不知道是否有（简单）方法可以做到这一点。理想情况下，它看起来像这样。

<div id='plumber5' class='plumber' style='width:50px;left:100px' value='numericValue'>Derek</div>

内联样式是在php中生成的，除了js可以检测到的样式（宽度，高度等）之外，想不出一种传递数值的方法。

例如。

<script>
a=document.getElementById('plumber5');
if (a.style.width=>75){
execute something here}
</script>

而不是使用样式作为测试的来源

它非常令人不安！谢谢

编辑 - 解决方案

function checkData($type){  
    a = document.getElementsByClassName($type);
    for(i = 0; i < a.length; i++)
    {
    if (a[i].getAttribute('data-dob') >= sessionStorage.Value) {
    // execute something here
    }
    }

}
4

4 回答 4

2

您可以使用 HTML5 的 data 属性将一些自定义数据添加到您的 HTML 标签中：

http://ejohn.org/blog/html-5-data-attributes/

例子：

<div data-value='10' id='plumber5' class='plumber' style='width: 50px; left: 100px;'>
    Derek
</div>

你可以得到这样的值：

<script>
    a = document.getElementById('plumber5');
    if (a.getAttribute('data-value') => 75) {
        // execute something here
    }
</script>
于 2013-01-24T13:11:33.287 回答
1

您可以通过data-这种方式使用属性：

<div id='plumber5' class='plumber' style='width: 50px; left: 100px'
     data-value='numericValue'>Derek</div>

注意： HTML5 数据属性仅在现代浏览器（如 IE 9+、Chrome 12+、Firefox 5+）中受支持。

style请注意，您在属性中有错误。代替：

style='width=50px;left=100px'

和：

style='width: 50px; left: 100px'
于 2013-01-24T13:11:31.050 回答
1

HTML5 支持data-*标签属性，因此您可以使用：

<div id='plumber5' class='plumber' data-value='numericValue' data-myothervalue='otherOne'>
    Derek
</div>

编辑

由于它在评论中看起来很乱，以下是访问示例值的方法：

var myDiv = document.getElementById('plumber5'); 
var myVal = myDiv.getAttribute('data-value');         // 'numericValue'
var myVal2 = myDiv.getAttribute('data-myothervalue'); // 'otherOne'
于 2013-01-24T13:11:50.067 回答
1

如果您的受众不支持 HTML5，您可以嵌入一个 div，例如：

<div id="plumber5" class="plumber" style="width:50px;left:100px">
    Derek
    <div style="display: none">numericValue</div>
</div>

这将隐藏视图中的值，但允许您访问它查看 Javascript。

于 2013-01-24T13:14:02.900 回答