Willkommen auf dem Portal für Mediengestalter
|
|
Autor |
Nachricht |
schachbrett
Dabei seit: 11.10.2006
Ort: Köln
Alter: -
Geschlecht:
|
Verfasst Mi 20.12.2006 15:48
Titel
|
|
|
So bekommst du auch noch die Sternchen:
Code: | <input type="text" name="password" value=""
onfocus="this.value=GEHEIMWORT"
onblur="GEHEIMWORT=this.value;this.value=this.value.replace(/(.)/g,'*')"
/>
|
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 20.12.2006 16:11
Titel
|
|
|
Du würdest das Passwort ja sowieso in value="" einsetzen, dann könntest du es auch
im mouseover() unterbringen und es ca. so machen..
Code: | showPassword = function(password) {
var e = document.getElementById('pw');
if(e.value != 'password') {
e.value = password;
}
} |
Code: | <form method="post" action="">
<input type="text" value="******" id="pw" onmouseover="showPassword('passwort')" onmouseout="this.value='******';" />
</form> |
So kommen die Sternchen zwar nicht auf die genaue Anzahl der Buchstaben des Passwortes,
aber vielleicht kannst du davon ja absehen.
|
|
|
|
|
Anzeige
|
|
|
Account gelöscht
Ort: -
Alter: -
|
Verfasst Do 21.12.2006 14:30
Titel
|
|
|
So sollte es auch (in meinem wenigstens) ie funzen, wie gesagt - elemente tauschen.
Code: | DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript">
// Globals
var pw = new Object();
var text = new Object();
var parent = new Object();
// on Load
init = function(){
pw = document.getElementById('password');
text = document.createElement("input");
text.setAttribute("type", "text");
parent = pw.parentNode;
doBindings();
}
doBindings = function() {
pw.onmouseover = mouseover;
text.onmouseout = mouseout;
}
mouseover = function() {
text.value = this.value;
parent.replaceChild(text, this);
text.focus();
}
mouseout = function() {
pw.value = this.value;
parent.replaceChild(pw, this);
pw.focus();
}
</script>
</head>
<body onload="init()">
<form action="#">
<input type="password" name="password" id="password"/>
</form>
</body>
</html>
|
Zuletzt bearbeitet von am Do 21.12.2006 14:31, insgesamt 1-mal bearbeitet
|
|
|
|
|
beeviZ
Threadersteller
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 22.12.2006 10:16
Titel
|
|
|
Ah sieht gut aus. Habs noch nicht ausprobiert, werd ich aber gleich tun. Hab auch noch ne andere Frage. Bin jetzt nicht so der Javascript Experte wie Ihr sicherlich gemerkt habt. Möchte nun aber bei einigen Textfeldern mit einer bestimmten Klasse 2 Buttons automatisch anfügen. Im Moment hab ich die noch in meine HTML Datei selbst geschrieben. Nun soll das aber automatisch passieren. Mein Code bisher:
Code: | function resizeTextarea(id, faktor) {
e = document.getElementById(id);
hoehe = e.rows*1;
faktor = faktor*1;
e.rows = hoehe+faktor;
} |
Code: | <p class="friendlyform">
<input type="button" value="enlarge" onclick="resizeTextarea('t',3);" /><br />
<input type="button" value="shrink" onclick="resizeTextarea('t',-3);" /><br />
</p>
<p>
<textarea id="t" name="textarea" rows="8" cols="30" class="resizeable"></textarea>
</p> |
Habe dazu praktischerweise diese Funktion im Netz gefunden:
Code: | function getElementsByClassName(class_name) {
var all_obj;
var ret_obj = new Array();
var j = 0;
var teststr;
if(document.all) {
all_obj=document.all;
}
else if(document.getElementsByTagName && !document.all) {
all_obj=document.getElementsByTagName("*");
}
for(i=0;i<all_obj.length;i++) {
if(all_obj[i].className.indexOf(class_name)!=-1) {
teststr=","+all_obj[i].className.split(" ").join(",")+",";
if(teststr.indexOf(","+class_name+",")!=-1) {
ret_obj[j]=all_obj[i];
j++;
}
}
}
return ret_obj;
} |
Gut, nun möchte ich diese beiden Buttons enlarge & shrink automatisch hinter ein Textfeld einfügen, wenn dieses die Klasse "resizable" hat. Habe mit createElement und so rumprobiert, habs aber nur hinbekommen innerhalb eines <p>, <div> oder was auch immer diese Buttons zu erzeugen. Wenn ich Code: | mytextarea.appendChild(button); | gemacht habe, also versucht habe die Buttons als Kindelemente der Textarea zu erzeugen hats logischerweise nicht funktioniert.
So. Lange Rede kurzer Sinn, wie schaffe ich es diese beiden Buttons, optimalerweise mit variablem "faktor" Argument über JS zu erzeugen, dass ich diese nicht für jedes Textfeld einzeln in das HTML Dokument schreiben muss?
|
|
|
|
|
beeviZ
Threadersteller
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 22.12.2006 13:07
Titel
|
|
|
das is übrigens mein script was soweit funktioniert:
Code: |
function addEvent(id, factor) {
var textareaWrap = document.getElementById('expandableTextarea');
var divIdName = "myDiv";
var newdiv = document.createElement('div');
newdiv.setAttribute("id",divIdName);
newdiv.innerHTML = '<input type="button" onclick="resizeTextarea(\''+id+'\', '+factor+');" value="Resize" />';
alert(newdiv.innerHTML);
textareaWrap.appendChild(newdiv);
} |
Code: |
<p><a href="javascript:;" onclick="addEvent('t',3);">Add Some Elements</a></p>
<p id="expandableTextarea">
<textarea id="t" cols="40" rows="5"></textarea>
</p>
|
nur muss ich halt da zwangsweise nen paragraphen oder div oder sonstwas um die textarea packen, und die id vom jeweiligen textfeld angeben. lieber wärs mir ich packe eine textarea in der form
<textarea id="nachricht" cols="40" rows="5" class="resizeable"></textarea>
ins dokument, und für jedes textfeld mit der class="resizeable" wird dann zusätzlich noch son konstrukt angehängt in der form:
<input type="button" onclick="resizeTextarea(textareaID, 3);" value="Larger!" /><input type="button" onclick="resizeTextarea(textareaID, -3);" value="Smaller!" />
das eben jemand der javascript nicht aktiviert hat keinen für ihn sowieso sinnlosen button angezeigt bekommt, sondern eben garnichts. bin zu blöd das oben gepostete script umzuschreiben. wer kann helfen? schinken? m?
|
|
|
|
|
Account gelöscht
Ort: -
Alter: -
|
Verfasst Fr 22.12.2006 14:41
Titel
|
|
|
So ähnlcih vielleicht, mit insertBefore()
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript">
var elements = new Array();
init = function() {
elements = document.getElementsByTagName("TEXTAREA");
for (var i=0; i<elements.length; i++)
{
if (elements[i].className == "resizable") {
makeLinks(elements[i]);
}
}
}
function makeLinks(element) {
parent = element.parentNode;
sibling = element.nextSibling;
linkTop = document.createElement("A");
linkTop.innerHTML = "mehr"
linkTop.setAttribute("href", "#");
linkBottom = document.createElement("A");
linkBottom.innerHTML = "weniger"
linkBottom.setAttribute("href", "#");
parent.insertBefore(linkBottom, sibling);
parent.insertBefore(linkTop, sibling);
}
</script>
</head>
<body onload="init()">
<form action="#">
<textarea rows="10" cols="30" id="text1" class="resizable">mit class="resizable"</textarea><br/>
<textarea rows="10" cols="30" id="text1">ohne</textarea><br/>
<textarea rows="10" cols="30" id="text1" class="resizable">mit</textarea><br/>
<textarea rows="10" cols="30" id="text1" class="resizable">mit</textarea>
</form>
</body>
</html>
|
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 22.12.2006 15:51
Titel
|
|
|
Ja, mit insertBefore ist eleganter. Und der Vollständigkeit wegen.
Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="javascript" type="text/javascript">
var elements = new Array();
init = function() {
elements = document.getElementsByTagName("TEXTAREA");
for (var i=0; i<elements.length; i++)
{
if (elements[i].className == "resizable") {
makeLinks(elements[i]);
}
}
}
function makeLinks(element) {
var textareaId = element.getAttribute('id');
var parent = element.parentNode;
var sibling = element.nextSibling;
linkTop = document.createElement("A");
linkTop.innerHTML = "weniger"
linkTop.setAttribute("href", "#");
linkTop.onclick = function() {
resizeTextarea(textareaId, -3);
}
linkBottom = document.createElement("A");
linkBottom.innerHTML = "mehr "
linkBottom.setAttribute("href", "#");
linkBottom.onclick = function() {
resizeTextarea(textareaId, 3);
}
parent.insertBefore(linkBottom, sibling);
parent.insertBefore(linkTop, sibling);
}
resizeTextarea = function(id, faktor) {
var e = document.getElementById(id);
hoehe = e.rows*1;
faktor = faktor*1;
e.rows = hoehe+faktor;
}
</script>
</head>
<body onload="init()">
<form action="#">
<textarea rows="10" cols="30" id="text1" class="resizable">mit class="resizable"</textarea><br/>
<textarea rows="10" cols="30" id="text2">ohne</textarea><br/>
<textarea rows="10" cols="30" id="text3" class="resizable">mit</textarea><br/>
<textarea rows="10" cols="30" id="text4" class="resizable">mit</textarea>
</form>
</body>
</html> |
...
Zuletzt bearbeitet von m am Fr 22.12.2006 16:00, insgesamt 5-mal bearbeitet
|
|
|
|
|
beeviZ
Threadersteller
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 22.12.2006 16:30
Titel
|
|
|
hey super. danke euch beiden. hab jetzt n script gebastelt welches erlaubt durch setzen der klasse "resizeable" textfelder zu vergrößern
wer möchte:
http://manuelbieh.com/upload/add2.html
|
|
|
|
|
|
|
|
Ähnliche Themen |
IE Transparentes PNG flackert (PNG-Fix)
Photoshop 7 flackert
Hover mit JQuery flackert
[Flash] loadMovie flackert !
InDesign/Mac/Bildschirm flackert
Flash Animation flackert
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben. Du kannst auf Beiträge in diesem Forum nicht antworten. Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|