87,910
社区成员
发帖
与我相关
我的任务
分享谁能将以下jQuery代码翻译成原生态JS代码[有点难度]
function fileQueued(file)//队列添加成功
{
for(var i in selQueue)if(selQueue[i].name==file.name){swfu.cancelUpload(file.id);return false;}//防止同名文件重复添加
if(selQueue.length==0)$('#controlBtns').show();
selQueue.push(file);
allSize+=file.size;
$('#listBody').append('<tr id="'+file.id+'"><td>'+file.name+'</td><td>'+formatBytes(file.size)+'</td><td id="'+file.id+'_state">就绪</td></tr>');
$('#'+file.id).hover(function(){$(this).addClass('hover');},function(){$(this).removeClass('hover');})
.click(function(){selectID=file.id;$('#listBody tr').removeClass('select');$(this).removeClass('hover').addClass('select');$('#btnClear').show();})
}
又遇到table动态添加行，搞不定呀
{
for(var i in selQueue)if(selQueue[i].name==file.name){swfu.cancelUpload(file.id);return false;}//防止同名文件重复添加
if(selQueue.length==0)$('#controlBtns').show();
selQueue.push(file);
allSize+=file.size;
$('#listBody').append('<tr id="'+file.id+'"><td>'+file.name+'</td><td>'+formatBytes(file.size)+'</td><td id="'+file.id+'_state">就绪</td></tr>');
$('#'+file.id).hover(function(){$(this).addClass('hover');},function(){$(this).removeClass('hover');})
.click(function(){selectID=file.id;$('#listBody tr').removeClass('select');$(this).removeClass('hover').addClass('select');$('#btnClear').show();})
}
又遇到table动态添加行，搞不定呀
...全文
请发表友善的回复…
发表回复
看小雪 2012-05-10
- 打赏
- 举报
调好了一半。
看小雪 2012-05-10
- 打赏
- 举报
头都大了，弄了一天都没弄好。
给个线上的网址：gufa.xp3.biz，会用fiddle的试下，非常感谢！
给个线上的网址：gufa.xp3.biz，会用fiddle的试下，非常感谢！
峭沙 2012-05-08
- 打赏
- 举报
function fileQueued(file)//队列添加成功
{
for(var i in selQueue){
if(selQueue[i].name==file.name){
swfu.cancelUpload(file.id);
return false;
}//防止同名文件重复添加
}
if(selQueue.length==0){
$('#controlBtns').show();
}
selQueue.push(file);
allSize+=file.size;
var listBody = $("listBody"),
tr = createElement("tr"),
td_1 = createElement("td"),
td_2 = createElement("td"),
td_3 = createElement("td"),
el = $(file.id);
td_1.innerHTML = file.name;
td_2.innerHTML = formatBytes(file.size);
td_3.id = file.id + "_state";
td_3.innerHTML = "就绪";
tr.id = file.id;
tr.appendChild(td_1);
tr.appendChild(td_2);
tr.appendChild(td_3);
listBody.appendChild(tr);
addEventListener(el, "click", function(){
selectID=file.id;
var trs = $$("tr");
for(var i = 0, len = trs.length; i < len; i++){
removeClass(trs[i], "select");
}
removeClass(this, "hover");
addClass(this, "select");
var btnClear = $("btnClear");
btnClear.display = "";
});
addEventListener(el, "mouseover", function(event){
var relatedElement = event.relatedTarget || event.fromElement;
if(!contains(this, relatedElement){
addClass(this, "hover");
}
});
addEventListener(el, "mouseout", function(event){
var relatedElement = event.relatedTarget || event.toElement;
if(!contains(this, relatedElement){
removeClass(this, "hover");
}
});
}
function $(id){
return document.getElementById(id);
}
function $$(tagName){
return document.getElementsByTagName(tagName);
}
function createElement(tagName){
return document.createElement(tagName);
}
function contains(elem1, elem2){
if(elem1 === elem2){
return true;
}
var parent = elem2.parentNode;
while(parent && parent !== document){
if(parent === elem1){
return true;
}else{
parent = parent.parentNode;
}
}
return false;
}
function addEventListener(el, type, fn){
if(el.addEventListener){
el.addEventListener(type, fn, false);
}else if(el.attachEvent){
el.attachEvent("on" + type, function(){
fn.call(el, window.event);
});
}
}
function addClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(!reg.test(className)){
el.className += " " + clz;
}
}
function removeClass(el, clz){
var reg = new RegExp("\\b" + clz + "\\b");
if(reg.test(el.className)){
el.className = el.className.replace(reg, "").replace(/\s{2,}/g, " ");
}
}看小雪 2012-05-07
- 打赏
- 举报
我要是真的能把JS给学精通了，就不来问了。
我记得table是不能innerHTML的，不晓得append是怎样实现的。
我记得table是不能innerHTML的，不晓得append是怎样实现的。
001007009 2012-05-07
- 打赏
- 举报
楼主 还是学学jquery 和 原生js吧
http://www.w3school.com.cn/jquery/index.asp
http://www.w3school.com.cn/js/index.asp
如果楼主主要是php，大可去了解下jquery，读下api，晓得常用方法的意思，上面的问题就不是问题了。
http://www.w3school.com.cn/jquery/index.asp
http://www.w3school.com.cn/js/index.asp
如果楼主主要是php，大可去了解下jquery，读下api，晓得常用方法的意思，上面的问题就不是问题了。
001007009 2012-05-07
- 打赏
- 举报
[Quote=引用 4 楼 的回复:]
我要是真的能把JS给学精通了，就不来问了。
我记得table是不能innerHTML的，不晓得append是怎样实现的。
[/Quote]
ie下 table不能直接 append
需要用tbody 来过渡一下。
我要是真的能把JS给学精通了，就不来问了。
我记得table是不能innerHTML的，不晓得append是怎样实现的。
[/Quote]
ie下 table不能直接 append
需要用tbody 来过渡一下。
峭沙 2012-05-07
- 打赏
- 举报
老是有一些小错误，蛋疼。。粗心是魔鬼啊
function fileQueued(file)//队列添加成功
{
for(var i in selQueue){
if(selQueue[i].name==file.name){
swfu.cancelUpload(file.id);
return false;
}//防止同名文件重复添加
}
if(selQueue.length==0){
$('#controlBtns').show();
}
selQueue.push(file);
allSize+=file.size;
var listBody = $("listBody"),
tr = createElement("tr"),
td_1 = createElement("td"),
td_2 = createElement("td"),
td_3 = createElement("td"),
el = $(file.id);
td_1.innerHTML = file.name;
td_2.innerHTML = formatBytes(file.size);
td_3.id = file.id + "_state";
td_3.innerHTML = "就绪";
tr.id = file.id;
tr.appendChild(td_1);
tr.appendChild(td_2);
tr.appendChild(td_3);
listBody.appendChild(tr);
addEventListener(el, "click", function(){
selectID=file.id;
var trs = $$("tr");
for(var i = 0, len = trs.length; i < len; i++){
removeClass(trs[i], "select");
}
removeClass(this, "hover");
addClass(this, "select");
var btnClear = $("btnClear");
btnClear.display = "";
});
addEventListener(el, "mouseover", function(event){
var relatedElement = event.relatedTarget || event.fromElement;
if(!contains(this, relatedElement){
addClass(this, "hover");
}
});
addEventListener(el, "mouseout", function(event){
var relatedElement = event.relatedTarget || event.toElement;
if(!contains(this, relatedElement){
removeClass(this, "hover");
}
});
}
function $(id){
return document.getElementById(id);
}
function $$(tagName){
return document.getElementsByTagName(tagName);
}
function createElement(tagName){
return document.createElement(tagName);
}
function contains(elem1, elem2){
if(elem1 === elem2){
return true;
}
var parent = elem2.parentNode;
while(parent && parent !== document){
if(parent === elem1){
return true;
}else{
parent = parent.parentNode;
}
}
return false;
}
function addEventListener(el, type, fn){
if(el.addEventListener){
el.addEventListener(type, fn, false);
}else if(el.attachEvent){
el.attachEvent("on" + type, function(){
fn.call(el, window.event);
});
}
}
function addClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(reg.test(className)){
el.className += " " + clz;
}
}
function removeClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(reg.test(className)){
el.className = className.replace(reg, "").replace(/\s{2,}/g, " ");
}
}峭沙 2012-05-07
- 打赏
- 举报
function fileQueued(file)//队列添加成功
{
for(var i in selQueue){
if(selQueue[i].name==file.name){
swfu.cancelUpload(file.id);
return false;
}//防止同名文件重复添加
}
if(selQueue.length==0){
$('#controlBtns').show();
}
selQueue.push(file);
allSize+=file.size;
var listBody = $("listBody"),
tr = createElement("tr"),
td_1 = createElement("td"),
td_2 = createElement("td"),
td_3 = createElement("td"),
el = $(file.id);
td_1.innerHTML = file.name;
td_2.innerHTML = formatBytes(file.size);
td_3.id = file.id + "_state";
td_3.innerHTML = "就绪";
td.id = file.id;
td.appendChild(td_1);
td.appendChild(td_2);
td.appendChild(td_3);
listBody.appendChild(td);
addEventListener(el, "click", function(){
selectID=file.id;
var trs = $$("tr");
for(var i = 0, len = trs.length; i < len; i++){
removeClass(trs[i], "select");
}
removeClass(this, "hover");
addClass(this, "select");
var btnClear = $("btnClear");
btnClear.display = "";
});
addEventListener(el, "mouseover", function(event){
var relatedElement = event.relatedTarget || event.fromElement;
if(!contains(this, relatedElement){
addClass(this, "hover");
}
});
addEventListener(el, "mouseout", function(event){
var relatedElement = event.relatedTarget || event.toElement;
if(!contains(this, relatedElement){
removeClass(this, "hover");
}
});
}
function $(id){
return document.getElementById(id);
}
function $$(tagName){
return document.getElementsByTagName(tagName);
}
function createElement(tagName){
return document.createElement(tagName);
}
function contains(elem1, elem2){
if(elem1 === elem2){
return true;
}
var parent = elem2.parentNode;
while(parent && parent !== document){
if(parent === elem1){
return true;
}else{
parent = parent.parentNode;
}
}
return false;
}
function addEventListener(el, type, fn){
if(el.addEventListener){
el.addEventListener(type, fn, false);
}else if(el.attachEvent){
el.attachEvent("on" + type, function(){
fn.call(el, window.event);
});
}
}
function addClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(reg.test(className)){
el.className += " " + clz;
}
}
function removeClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(reg.test(className)){
el.className = className.replace(reg, "").replace(/ {2,}/g, " ");
}
}峭沙 2012-05-07
- 打赏
- 举报
function fileQueued(file)//队列添加成功
{
for(var i in selQueue){
if(selQueue[i].name==file.name){
swfu.cancelUpload(file.id);
return false;
}//防止同名文件重复添加
}
if(selQueue.length==0){
$('#controlBtns').show();
}
selQueue.push(file);
allSize+=file.size;
var listBody = $("listBody"),
tr = createElement("tr"),
td_1 = createElement("td"),
td_2 = createElement("td"),
td_3 = createElement("td"),
el = $(file.id);
td_1.innerHTML = file.name;
td_2.innerHTML = formatBytes(file.size);
td_3.id = file.id + "_state";
td_3.innerHTML = "就绪";
td.id = file.id;
td.appendChild(td_1);
td.appendChild(td_2);
td.appendChild(td_3);
listBody.appendChild(td);
addEventListener(el, "click", function(){
selectID=file.id;
var trs = $$("tr");
for(var i = 0, len = trs.length; i < len; i++){
removeClass(trs[i], "select");
}
removeClass(this, "hover");
addClass(this, "select");
var btnClear = $("btnClear");
btnClear.display = "";
});
addEventListener(el, "mouseover", function(event){
var relatedElement = event.relatedTarget || event.fromElement;
if(!contains(this, relatedElement){
addClass(this, "hover");
}
});
addEventListener(el, "mouseout", function(event){
var relatedElement = event.relatedTarget || event.toElement;
if(!contains(this, relatedElement){
removeClass(this, "hover");
}
});
}
function $(id){
return document.getElementById(id);
}
function $$(tagName){
return document.getElementsByTagName(tagName);
}
function createElement(tagName){
return document.createElement(tagName);
}
function contains(elem1, elem2){
if(elem1 === elem2){
return true;
}
var parent = elem2.parentNode;
while(parent && parent !== document){
if(parent === elem1){
return true;
}
}
return false;
}
function addEventListener(el, type, fn){
if(el.addEventListener){
el.addEventListener(type, fn, false);
}else if(el.attachEvent){
el.attachEvent("on" + type, function(){
fn.call(el, window.event);
});
}
}
function addClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(reg.test(className)){
el.className += " " + clz;
}
}
function removeClass(el, clz){
var className = el.className,
reg = new RegExp("\\b" + clz + "\\b");
if(className === ""){
el.className = clz;
}else if(reg.test(className)){
el.className = className.replace(reg, "").replace(/ {2,}/g, " ");
}
}看小雪 2012-05-06
- 打赏
- 举报
兄弟们，就这一段代码
谢谢。
$('#listBody').append('<tr id="'+file.id+'"><td>'+file.name+'</td><td>'+formatBytes(file.size)+'</td><td id="'+file.id+'_state">就绪</td></tr>');
$('#'+file.id).hover(function(){$(this).addClass('hover');},function(){$(this).removeClass('hover');})
.click(function(){selectID=file.id;$('#listBody tr').removeClass('select');$(this).removeClass('hover').addClass('select');$('#btnClear').show();})谢谢。
看小雪 2012-05-06
- 打赏
- 举报
JS高手，顶起呀。我主要是弄PHP方面的，前端懂的不多呀
