ugrás a tartalomhoz

Browse gomb a mező alatt

Anonymous · 2004. Nov. 28. (V), 19.00
Szeretném megkérdezni, hogy megoldható-e valahogy, hogy az <input type="file" name="file1"> mező Browse gombja ne a mező után, hanem alá kerüljön.

Előre is kösz
Éva
‹ Javascript obfuszkálás Kijelölt elem módosítása ›
 ■
1

Firefoxos, XHTML-es

bbalint · 2004. Nov. 28. (V), 21.53

<?xml version="1.0" encoding="ISO-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu" lang="hu" dir="ltr">
<head>
<title>00067</title>
<style type="text/css"><![CDATA[
#file1-div{
height: 2.75em;
overflow: hidden;
}
#file1-fake{
height: 1.2em;
width: 130px;
}
#file1{
position: relative;
top: 1.75em;
left: -280px;
}
]]>
</style>
</head>
<body>
<div>
<form action="" method="post" enctype="multipart/form-data">
<div id="file1-div">
<input type="text" id="file1-fake"/>
<input type="file" name="file1" id="file1" onchange="document.getElementById('file1-fake').value=this.value;"/>
</div>
</form>
</div>
</body>
</html>
2

Internet Explorer-es, HTML-es

bbalint · 2004. Nov. 28. (V), 22.02

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="hu" dir="ltr">
<head>
<title>00067</title>
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-2">
<style type="text/css"><!--
#file1-div{
height: 2.75em;
overflow: hidden;
}
#file1-fake{
height: 1.2em;
width: 130px;
}
#file1{
position: relative;
left: -1000px;
width: 160px;
}
-->
</style>
</head>
<body>
<div>
<form action="" method="post" enctype="multipart/form-data">
<div id="file1-div">
<input type="text" id="file1-fake"><br>
<button type="button" onclick="document.getElementById('file1').click();">Tallózás</button>
<input type="file" name="file1" id="file1" onchange="document.getElementById('file1-fake').value=this.value;"><br>
</div>
</form>
</div>
</body>
</html>
3

operás, XHTML-es

bbalint · 2004. Nov. 28. (V), 22.06

<?xml version="1.0" encoding="ISO-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu" lang="hu" dir="ltr">
<head>
<title>00067</title>
<style type="text/css"><![CDATA[
#file1-div{
height: 2.75em;
overflow: hidden;
}
#file1-fake{
height: 1.2em;
width: 130px;
}
#file1{
position: relative;
top: 1.75em;
left: -260px;
}
]]>
</style>
</head>
<body>
<div>
<form action="" method="post" enctype="multipart/form-data">
<div id="file1-div">
<input type="text" id="file1-fake"/>
<input type="file" name="file1" id="file1" onchange="document.getElementById('file1-fake').value=this.value;"/>
</div>
</form>
</div>
</body>
</html>
4

próbálkozások

bbalint · 2004. Nov. 28. (V), 22.09
szóval ezek csak amolyan próbálkozások, hogy nem reménytelen a dolog, de igencsak lehetetlen megcsinálni, mert. mert nem hinném hogy csak ez a két böngésző és internet explorer létezik, meg nemcsak windows platform, illetve.

az egész arra épül, hogyha megváltozik file1 akkor az onchange attribútumnál levő kóddal az "ál" beviteli mezőbe beíródik a file neve.

(szvsz) amíg minden böngésző ilyen máshogy jeleníti meg a file-feltöltő mezőt, addig inkább meg kéne elégedni a jelenlegi formájával.

bbalint
5

Köszi a válaszokat. Azért

Anonymous · 2004. Nov. 28. (V), 22.12
Köszi a válaszokat. Azért kipróbálom őket.
6

elerhetetlen, gyanus

Jano · 2004. Nov. 28. (V), 22.57
Ha jol emlekeszem errol mar egyszer vitatkoztunk itt. Ezek olyan megoldasok amik valamifele hackeleskent atalakitjak ugyan a beviteli mezot de nem 100%-os megoldasuak.

Nem lesz biztos a mukodese, nem fog ugyanugy mukodni mint eredeti.
User sajat bongeszoje altal kirajzolt form elemekhez van szokva. Ha valami mashogy nez ki akkor meg akar gyanakodni is kezdhet.

Szerintem nem eri meg kockaztatni. A fajl feltoltes valoszinuleg eleg fontos funkcio ahhoz, hogy tutira mukodjon.