大佬教程收集整理的这篇文章主要介绍了是否有CSS选择器来检测输入是否选择了文本文件？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
注意与“checked”属性和“defaultChecked”和“checked”属性有类似的关系;如果您使用属性选择器[checked]而不是伪类：checked,则在复选框的状态更改时,将不会看到样式更改.与“checked”系列不同,“value”没有可以使用的对应的伪类.
尝试以下测试页面：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/Strict.dtd"> <html> <head> <title>Dynamic attribute SELEctors</title> <style type="text/css"> input:not([value]),div:not([value]) { BACkground-color: #F88; } input[value],div[value] { border: 5px solid #8F8; } input[value=""],div[value=""] { border: 5px solid #F8F; } input:not([value=""]),div:not([value=""]) { color: blue; border-style: dashed; } *.big { font-size: 200%; } </style> <script> function getElt() { var id=prompt("Enter ID of element","d1"); if (id) { return document.getElementById(id); } else { return {ClassName: ''}; } } function embiggen() { getElt().className="big"; return false; } function smallify() { getElt().className=""; return false; } </script> </head> <body> <form method="post" enctype="multipart/form-data"> <div id="d1">no value</div> <div id="d2" value="">empty value</div> <div id="d3" value="some">some value</div> <p><label for="foo">foo:</label> <input name="foo" id="foo" /></p> <p><label for="bam">bam:</label> <input name="bam" id="bam" value="bug-AWWK" /></p> <p><label for="file">File to upload:</label> <input type="file" name="file" id="file" onchange="SETVALueAttr(this)"/></p> <input type="button" value="Embiggen" onclick="return embiggen()" /> <input type="button" value="smallify" onclick="return smallify()" /> </body> </html>
改变任何东西的价值和风格都不会改变.改变任何事物的类别,风格会改变.如果添加以下JS函数并将其绑定到输入上的更改事件,则背景样式将更改.
function bindValue(elt) { var oldVal=elt.getAttribute('value'); elt.setAttribute('value',elt.value); var newVal=elt.getAttribute('value'); if (oldVal != newVal) { alert('Had to change value from "'+oldVal+'" to "'+newVal+'"'); } }
这将“value”属性绑定到“value”属性,因此用户输入对前者的更新将传播到后者(以编程方式设置“value”属性不会导致更改事件).
在检查前后文件输入的JS属性(通过使用以下脚本)时,唯一具有明显变化的属性是“值”.从此,我怀疑有任何其他HTML属性发生变化,因此可以在属性选择器中使用.
<script> var file = {Blank: {},diff: {}}; var fInput = document.getElementById('file'); for (p in fInput) { try { file.blank[p] = fInput[p]; } catch (err) { file.blank[p] = "Error: setTing '"+p+"' resulted in '"+err+"'"; } } function fileDiff() { for (p in fInput) { try { if (file.blank[p] != fInput[p]) { file.diff[p] = {orig: file.blank[p],now: fInput[p]}; } } catch (err) { //file.diff[p] = "Error: accessing '"+p+"' resulted in '"+err+"'"; } } } if (fInput.addEventListener) { fInput.addEventListener('change',fileDiff,falsE); } else if (fInput.attachEvent) { fInput.attachEvent('onchange',fileDiff); } else { fInput.onchange = fileDiff; } </script>
您可以使用链接到不存在的片段和所访问的伪类来组合某些东西,但它是非常令人震惊的.
<style> a input { display: none; } :not(a) + a input,a:visited + a input { display: block /* or "inline" */ ; } </style> ... <a href="#asuhacrpbt"><input type="file" ... /></a> <a href="#cmupbnhhpw"><input type="file" ... /></a> <a href="#mcltahcrlh"><input type="file" ... /></a>
每次加载页面时,您都需要为链接生成未访问的目标.由于您必须在服务器端执行此操作,因此您无法完全确定地完成此操作,尽管您可以获得以任意方式接近0生成以前访问的目标的概率.它也不适用于所有浏览器,例如苹果浏览器.我怀疑这是由于CSS2和CSS3的以下原因：
您可能可以使用其他元素上的其他选择器来共同使用,但我怀疑这不能干净地完成.
以上是大佬教程为你收集整理的是否有CSS选择器来检测输入是否选择了文本文件？全部内容，希望文章能够帮你解决是否有CSS选择器来检测输入是否选择了文本文件？所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。