Heim Web-Frontend js-Tutorial select发展史

select发展史

May 16, 2016 pm 07:19 PM

本文旨在大家对select和模拟select有一个全面地了解,使此项技术能发挥出更高的水平。

最初的select的确很平淡,就是一个下拉选项列表:

1

2

3

4

5

6

7

8

<style>

select,option {background-color:lime}

</style>

<select>

<center>

<option>1

<option>2

<option>不是一样的嘛</select>

Nach dem Login kopieren

日久天长之后,人们对select要求高了,要修一修边幅:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

<br><br>

<script>

i=1;

</script>

<center>

<form name="form1">

  <select name="select01">

    <option>11111 111111 111111111111</option>

    <option>2222222</option>

    <option>333333</option>

    <option>4444444</option>

  </select>

<span style="position:relative;left:-23px;width:17px;height:17px;font:7px &#39;wingdings 3&#39;;color:#cc0000;background:cyan;border:2px outset;text-align:center;padding-top:3px;cursor:default" onclick="if(i>=document.form1.select01.options.length){i=0}document.form1.select01.options[i].selected=true;i++">q

<iframe src="" style="position:absolute;top:0;left:0;z-index:-1; width:15px;height:15px;filter:alpha(opacity=0))" frameborder="0"></iframe>

</span>

</form>

<br><br><br>

 

 

 

 

<html>

<head>

<title>Untitled Document</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<style>

.table1{background-color:white;FONT-FAMILY: Courier New, Courier;font-size:12px}

.td_out{FONT-FAMILY: Courier New, Courier;font-size:12px;color:#000000;height:15px;border:1 solid #ffffff;}

.td_over{FONT-FAMILY: Courier New, Courier;font-size:12px;cursor:default;background-color:#3366cc;border:1 solid #000000;color:#ffffff;height:15px}

.slv{vertical-align:bottom;FONT-FAMILY: Courier New, Courier;font-size:12px;border-left-width:0;border-top-width:0;border-bottom-width:0;border-right:0 solid #000000;vertical-align:middle;height:18px;color:#000000;}

.down{position:relative;left:-2px;font-size:11px;vertical-align:middle;width:16;height:16;color:#2050b0;background-color:#D0DFF7;border:1 solid #9fA3Ce;writing-mode:tb-rl;font-weight:bold;

}

.selp{

position:absolute;z-index:1000;overflow-x:hidden;border-left:1 solid #000000;border-bottom:1 solid #000000;border-right:1 solid #000000;

SCROLLBAR-FACE-COLOR: #d0dff7;

SCROLLBAR-HIGHLIGHT-COLOR: #d0dff7;

SCROLLBAR-SHADOW-COLOR: #FFFFFF;

SCROLLBAR-3DLIGHT-COLOR: #FFFFFF;

SCROLLBAR-ARROW-COLOR: #ffffff;

SCROLLBAR-TRACK-COLOR: #ffffff;

SCROLLBAR-DARKSHADOW-COLOR: #d0dff7;}

</style>

<script language="JavaScript">

document.onclick=hiddenDiv;

function getDivCount() {

 var arr=document.all;

 re=0;

 for (i=0;i<arr.length;i++) {

  str=arr[i].id; 

  if (str.indexOf("ZfDiv_")==0) {  

   re++; 

  }

 }

 return re;

}

 

function getI(ObjId) {//取得objId的最后一位数字

 for (i=0;i<ObjId.length;i++) {

  if (ObjId.charAt(i)=="_") return ObjId.substr(i+1,ObjId.length-1);

 }

 return 0;

}

 

function select_edit(TextObj){//鼠标经过高亮度

 TextObj.focus();TextObj.select();

}

 

function checkValue(ID){  

 var sl=document.all["ZfText_"+ID];

 var sv=document.all["ZfDiv_"+ID];

 var da=document.all["ZfData_"+ID];  

 sv.style.display=&#39;&#39;

  

 for(i=0;i<da.rows.length;i++)da.rows[i].style.display=&#39;&#39;

  

 for(i=0;i<da.rows.length;i++){

  if(da.rows[i].cells[0].innerText.indexOf(sl.value)!=0)da.rows[i].style.display=&#39;none&#39;;

  getPosition(ID);

 }

}

 

function getL(e){

 var l=e.offsetLeft;

 while(e=e.offsetParent){

  l+=e.offsetLeft;

 }

 return l

}

function getT(e){

 var t=e.offsetTop;

 while(e=e.offsetParent){

  t+=e.offsetTop;

 }

 return t

}

 

function getPosition(ID){

 var sv=document.all["ZfDiv_"+ID];

 var sl=document.all["ZfText_"+ID];

 var spn=document.all["ZfSpan_"+ID];

 var da=document.getElementById("ZfData_"+ID);

 sv.style.pixelWidth=spn.offsetWidth;

 da.style.pixelWidth=sv.offsetWidth;

 sv.style.pixelLeft=getL(spn);

 sv.style.pixelTop=getT(spn)+sl.offsetHeight+3;

 if(da.offsetHeight>200){

  sv.style.pixelHeight=200;

  sv.style.overflowY=&#39;scroll&#39;;

 }

 else {

  sv.style.pixelHeight=da.offsetHeight;

  sv.style.overflowY=&#39;hidden&#39;;

 }

}

 

function dropDown(ID){

 var sv=document.all["ZfDiv_"+ID]

 var tb=document.all["ZfData_"+ID]

  

 if(sv.style.display==&#39;none&#39;){ 

  sv.style.display=&#39;&#39;; 

  for(i=0;i<tb.rows.length;i++)tb.rows[i].style.display=&#39;&#39;

  getPosition(ID); 

 } else

  sv.style.display=&#39;none&#39;;

 }

}//下拉摸拟层

 

function hiddenDiv(){

 var o=window.event.srcElement.id;

 var tb

 var sv

 if(o=="") {

  for (j=0;j<getDivCount();j++) {

   tb=document.getElementById(&#39;ZfData_&#39;+j);

   sv=document.getElementById(&#39;ZfDiv_&#39;+j);  

   for(i=0;i<tb.rows.length;i++) tb.rows[i].style.display=&#39;&#39;;

   sv.style.display=&#39;none&#39;;  

  }

   

 }

 

}//隐藏模拟层

 

 

function setValue(obj){

var i=getI(obj.parentElement.parentElement.parentElement.id);

//alert(obj.parentElement.parentElement.parentElement.id);

 

var sl=document.all["ZfText_"+i];

var sv=document.all[&#39;ZfDiv_&#39;+i];

sl.value=obj.innerText;

sv.style.display=&#39;none&#39;;

//sldIndex=obj.parentElement.rowIndex;

}//给文本框赋值

 

function over(obj){

 obj.className="td_over"

 obj.title=obj.innerText

 obj.focus();

}//鼠标经过变色

 

function out(obj){

 obj.className="td_out"

}//鼠标离开还原

 

function String.prototype.Trim(){return this.replace(/(^\s*)|(\s*$)/g,&#39;&#39;)}//自定义去空格函数Trim()

 

 

//增加list的接口,ID表示该组控件是页面中的第几个

function add(v,ID){

var sv=document.all[&#39;ZfDiv_&#39;+ID];

if(!v.Trim()){return;}

var tb=document.all[&#39;ZfData_&#39;+ID];

var c=tb.insertRow(tb.rows.length).insertCell();

c.innerHTML=&#39;<nobr>&#39;+v.Trim()+&#39;</nobr>&#39;;

c.onmouseover=new Function("over(this)");

c.onmouseout=new Function("out(this)");

c.onclick=new Function("setValue(this)");

c.className="td_out";

v=&#39;&#39;;

}

//增加inpnubox的接口,在页面中产生一个inputbox控件,下拉列表为空

function addText(name,DefValue) {

 var i=getDivCount();

 document.write(&#39;<span id="ZfSpan_&#39;+i+&#39;" style="border:1 solid #9CA0CB">&#39;);

 document.write(&#39;<input type="text" value="&#39;+DefValue+&#39;" name="&#39;+name+&#39;" id="ZfText_&#39;+i+&#39;" ondblclick="ZfDrop_&#39;+i+&#39;.click()" class="slv" onmouseover="select_edit(this)"  onkeyup="checkValue(&#39;+i+&#39;)"><input type=button id="ZfDrop_&#39;+i+&#39;" value=">" onclick="this.hideFocus=true;dropDown(&#39;+i+&#39;);" class="down" onmouseover="this.style.backgroundColor=#EEF3FD" onmouseout="this.style.backgroundColor=\&#39;\&#39;" onmousedown="this.style.backgroundColor=#ABC4F5" onmouseup="this.style.backgroundColor=\&#39;\&#39;"></span>&#39;);

 document.write(&#39;<p id="ZfDiv_&#39;+i+&#39;" class="selp" style="display:none;"><table id="ZfData_&#39;+i+&#39;" onselectstart="return false" border="0"  cellspacing="0" cellpadding="0" class="table1"></table></p>&#39;);

}

 

  

 

</script>

</head>

<body>

 

<script language="JavaScript">

addText("name1","a");

add("1234",0);

add("1234",0);

addText("name1","a");

add("1234",1);

add("1234",1);

</script>

Nach dem Login kopieren

要加一些链接,变成菜单:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

328

329

330

331

332

333

334

335

336

337

338

339

340

341

342

343

344

345

346

347

348

349

350

351

352

353

354

355

356

357

358

359

360

361

362

363

364

365

366

367

368

369

370

371

372

373

374

375

376

377

378

379

380

381

382

383

384

385

386

387

388

389

390

391

392

393

394

395

396

397

398

399

400

401

402

403

404

405

406

407

408

409

410

411

412

413

414

415

416

417

418

419

420

421

422

423

424

425

426

427

428

429

430

431

432

433

434

435

436

437

438

439

440

441

442

443

444

445

446

447

448

449

450

451

<STYLE>

body { cursor: url(http://vip.6to23.com/candylau/image/xiucursor.cur)}

</STYLE>

 

 

 

 

<style>

.select{border: 0 inset buttonface; width: 100; font: icon; cursor: default;}

.selected{border: 0 inset buttonface; background: window; padding: 0; font: icon;}

.selectTable{height: 100%; width: 100%;border: 2 inset buttonhighlight; background: buttonface;}

.option    {font: icon; padding: 1; padding-left: 3; padding-right: 3; width: 100%;}

.dropDown{position: absolute; visibility: hidden; width: 100%;border: 1 solid windowtext; padding: 0;background: window;}

.select .button    {width: 16px; height: 5; font-family: webdings; padding: 0;font-size: 11px; border: 2 outset buttonhighlight;}

</style>

 

<script type="text/javascript">

var overOptionCss = "background: highlight; color: highlighttext";

var sizedBorderCss = "2 inset buttonhighlight";

var globalSelect;

var ie4 = (document.all != null);

var q = 0;

function initSelectBox(el) {

    copySelected(el);

    var size = el.getAttribute("size");

    el.options = el.children[1].children;

    el.selectedIndex = findSelected(el);

    el.remove = new Function("i", "int_remove(this,i)");

    el.item   = new Function("i", "return this.options[i]");

    el.add    = new Function("e", "i", "int_add(this, e, i)");   

    el.options[el.selectedIndex].selected = true;

 

    dropdown = el.children[1];

 

    if (size != null) {

        if (size > 1) {

            el.size = size;

            dropdown.style.zIndex = 0;

            initSized(el);

        }

        else {

            el.size = 1;

            dropdown.style.zIndex = 99;

            if (dropdown.offsetHeight > 200) {

                dropdown.style.height = "200";

                dropdown.style.overflow = "auto";

            }

        }

    }

     

    highlightSelected(el,true);

}

 

function int_remove(el,i) {

    if (el.options[i] != null)

        el.options[i].outerHTML = "";

}

 

function int_add(el, e, i) {

    var html = "<p class=&#39;option&#39; noWrap";

    if (e.value != null)

        html += " value=&#39;" + e.value + "&#39;";

    if (e.style.cssText != null)

        html += " style=&#39;" + e.style.cssText + "&#39;";

    html += ">";

    if (e.text != null)

        html += e.text;

    html += "</p>"

 

    if ((i == null) || (i >= el.options.length))

        i = el.options.length-1;

    el.options[i].insertAdjacentHTML("AfterEnd", html);

}

     

function initSized(el) {

    var h = 0;

    el.children[0].style.display = "none";

    dropdown = el.children[1];

    dropdown.style.visibility = "visible";

 

    if (dropdown.children.length > el.size) {

        dropdown.style.overflow = "auto";

        for (var i=0; i<el.size; i++) {

            h += dropdown.children[i].offsetHeight;

        }

 

        if (dropdown.style.borderWidth != null) {

            dropdown.style.pixelHeight = h + 4;

        }

 

        else

            dropdown.style.height = h;

    }

 

    dropdown.style.border = sizedBorderCss;

    el.style.height = dropdown.style.pixelHeight;

}

 

function copySelected(el) {

    var selectedIndex = findSelected(el);

    selectedCell = el.children[0].rows[0].cells[0];

    selectedDiv  =     el.children[1].children[selectedIndex];

    selectedCell.innerHTML = selectedDiv.outerHTML;

}

 

function findSelected(el) {

    var selected = null;

 

 

    ec = el.children[1].children;

    var ecl = ec.length;

     

    for (var i=0; i<ecl; i++) {

        if (ec[i].getAttribute("selected") != null) {

            if (selected == null) {

                selected = i;

            }

            else

                ec[i].removeAttribute("selected");

        }

    }

    if (selected == null)

        selected = 0;

 

    return selected;

}

 

function toggleDropDown(el) {

    if (el.size == 1) {

        dropDown = el.children[1];

         

        if (dropDown.style.visibility == "")

            dropDown.style.visibility = "hidden";

             

        if (dropDown.style.visibility == "hidden")

            showDropDown(dropDown);

        else

            hideDropDown(dropDown);

    }

}

 

function optionClick() {

    el = getReal(window.event.srcElement, "className", "option");

 

    if (el.className == "option") {

        dropdown  = el.parentElement;

        selectBox = dropdown.parentElement;

        oldSelected = dropdown.children[findSelected(selectBox)]

 

        if(oldSelected != el) {

            oldSelected.removeAttribute("selected");

            el.setAttribute("selected", 1);

            selectBox.selectedIndex = findSelected(selectBox);

        }

 

        if (selectBox.onchange != null) {

            if (selectBox.id != "") {

                eval(selectBox.onchange.replace(/this/g, selectBox.id));

            }

            else {

                globalSelect = selectBox;

                eval(selectBox.onchange.replace(/this/g, "globalSelect"));

            }

        }

 

        if (el.backupCss != null)

        el.style.cssText = el.backupCss;

        copySelected(selectBox);

        toggleDropDown(selectBox);

        highlightSelected(selectBox, true);

    }

}

 

function optionOver() {

    var toEl = getReal(window.event.toElement, "className", "option");

    var fromEl = getReal(window.event.fromElement, "className", "option");

    if (toEl == fromEl) return;

    var el = toEl;

    if (el.className == "option") {

        if (el.backupCss == null)

            el.backupCss = el.style.cssText;

        highlightSelected(el.parentElement.parentElement, false);

        el.style.cssText = el.backupCss + "; " + overOptionCss;

        this.highlighted = true;

    }

}

 

function optionOut() {

    var toEl = getReal(window.event.toElement, "className", "option");

    var fromEl = getReal(window.event.fromElement, "className", "option");

    if (fromEl == fromEl.parentElement.children[findSelected(fromEl.parentElement.parentElement)]) {

        if (toEl == null)

            return;

        if (toEl.className != "option")

            return;

    }

     

    if (toEl != null) {

        if (toEl.className != "option") {

            if (fromEl.className == "option")

                highlightSelected(fromEl.parentElement.parentElement, true);

        }

    }

     

    if (toEl == fromEl) return;

    var el = fromEl;

 

    if (el.className == "option") {

        if (el.backupCss != null)

            el.style.cssText = el.backupCss;

    }

 

}

 

function highlightSelected(el,add) {

    var selectedIndex = findSelected(el);

    selected = el.children[1].children[selectedIndex];

     

    if (add) {

        if (selected.backupCss == null)

            selected.backupCss = selected.style.cssText;

        selected.style.cssText = selected.backupCss + "; " + overOptionCss;

    }

    else if (!add) {

        if (selected.backupCss != null)

            selected.style.cssText = selected.backupCss;

    }

}

 

function hideShownDropDowns() {

var el = getReal(window.event.srcElement, "className", "select");

var spans = document.all.tags("SPAN");

var selects = new Array();

var index = 0;

     

    for (var i=0; i<spans.length; i++) {

if ((spans[i].className == "select") && (spans[i] != el)) {

    ropdown = spans[i].children[1];

if ((spans[i].size == 1) && (dropdown.style.visibility == "visible"))

    selects[index++] = dropdown;

    }

}

for (var j=0; j<selects.length; j++) {

hideDropDown(selects[j]);

}

}

 

function hideDropDown(el) {

    if (typeof(fade) == "function")

    fade(el, false);

    else

    el.style.visibility = "hidden";

}

 

function showDropDown(el) {

    if (typeof(fade) == "function")

    fade(el, true);

    else if (typeof(swipe) == "function")

    swipe(el, 2);

    else

    el.style.visibility = "visible";

}

 

function initSelectBoxes() {

var spans = document.all.tags("SPAN");

var selects = new Array();

var index = 0;

 

for (var i=0; i<spans.length; i++) {

if (spans[i].className == "select")

selects[index++] = spans[i];

}

for (var j=0; j<selects.length; j++) {

initSelectBox(selects[j]);

}   

}

 

function getReal(el, type, value) {

temp = el;

while ((temp != null) && (temp.tagName != "BODY")) {

if (eval("temp." + type) == value) {

el = temp;

return el;

}

temp = temp.parentElement;

}

return el;

}

if (ie4) {

window.onload = initSelectBoxes;

document.onclick = hideShownDropDowns;

}

function writeSelectBox(matrix, id, size, onchange, css) {

    var d = window.document;

    var ie4 = (document.all != null);

    if (ie4) {

//alert("Before!");

var s = createIEString(matrix, id, size, onchange, css);

document.write(s);

//alert("After!");

}else

{

document.write(createXString(matrix, id, size, onchange, css));}

}

 

function createIEString(matrix, id, size, onchange, css) {

    var str = "";

        str += &#39;<span class="select"&#39;;

        if (size == null)

            size = 1;

        str += &#39; size="&#39; + size + &#39;"&#39;;   

        if (id != null)

            str += &#39; id="&#39; + id + &#39;"&#39;;

        if (onchange != null)

            str += &#39; onchange="&#39; + onchange + &#39;"&#39;;

        if (css != null)

        str += &#39; style="&#39; + css + &#39;"&#39;;

        str += &#39;>\n&#39;;

        str += &#39;<table class="selectTable" cellspacing="0" cellpadding="0"\n&#39;;

        str += &#39; onclick="toggleDropDown(this.parentElement)">\n&#39;;

        str += &#39;<tr>\n&#39;;

        str += &#39;<td class="selected"> </td>\n&#39;;

        str += &#39;<td align="CENTER" valign="MIDDLE" class="Button"\n&#39;;

        str += &#39; onmousedown="this.style.border=\&#39;2 inset buttonhighlight\&#39;"\n&#39;;

        str += &#39; onmouseup="this.style.border=\&#39;2 outset buttonhighlight\&#39;">\n&#39;;

        str += &#39;<span style="position: relative; left: 0; top: -2; width: 100%;">6</span></td>\n&#39;;

        str += &#39;</tr>\n&#39;;

        str += &#39;</table>\n&#39;;

        str += &#39;<p class="dropDown" onclick="optionClick()" onmouseover="optionOver()" onmouseout="optionOut()">\n&#39;;

         

        for (var i=0; i<matrix.length; i++) {

            html     = matrix[i].html;

            value    = matrix[i].value;

            css      = matrix[i].css;

            selected = matrix[i].selected;

            str += &#39;<p class="option"&#39;;

            if (value != null)

                str += &#39; value="&#39; + value + &#39;"&#39;;

            if (css != null)

                str += &#39; style="&#39; + css + &#39;"&#39;;

            if (selected != null)

                str += &#39; selected&#39;;

            str += &#39;>\n&#39;;

            str += html;

            str += &#39;</p>\n&#39;;

        }

        str += &#39;</p>\n&#39;;

        str += &#39;</span>\n&#39;;

    return str;

}

 

function createXString(matrix, id, size, onchange, css) {

var str = &#39;<form>\n&#39;;

str += &#39;<select&#39;;

if (size == null)

    size = 1;

str += &#39; size="&#39; + size + &#39;"&#39;;   

if (id != null)

    str += &#39; id="&#39; + id + &#39;"&#39;;

if (onchange != null)

    str += &#39; onchange="&#39; + onchange + &#39;"&#39;;

str += &#39;>\n&#39;;

 

for (var i=0; i<matrix.length; i++) {

    html     = matrix[i].html;

    value    = matrix[i].value;

    css      = matrix[i].css;

    selected = matrix[i].selected;

    str += &#39;\n<option&#39;;

    if (value != null)

    str += &#39; value="&#39; + value + &#39;"&#39;;

    if (selected != null)

        str += &#39; selected&#39;;

    str += &#39;>&#39;;

    str += stripTags(html);

    str += &#39;</option>\n&#39;;

    }

    str += &#39;\n</select>\n&#39;;

    str += &#39;</form>\n&#39;;

return str;

}

 

function stripTags(str) {

    var s = 0;

    var e = -1;

    var r = "";

    s = str.indexOf("<",e);   

    do {

        r += str.substring(e + 1,s);

        e = str.indexOf(">",s);

        s = str.indexOf("<",e);

    }

    while ((s != -1) && (e != -1))

    r += str.substring(e + 1,str.length);

    return r;

}

 

function Option(html, value, css, selected) {

    this.html = html;

    this.value = value;

    this.css = css;

    this.selected = selected;

}

</script>

<script type="text/javascript">

var optionArray = new Array();

optionArray[0] = new Option("Item 1", "value 1", "color: blue; text-decoration: underline;");

optionArray[1] = new Option("Item <b>2</b>", "value 2");

optionArray[2] = new Option("Item 3", "value 3", "color: red;", "selected");

optionArray[3] = new Option("Item 4", "value 4");

optionArray[4] = new Option("Item 5", "value 5");

writeSelectBox(optionArray, "select1", 1, "alert(this.options[this.selectedIndex].value)", "margin-left: 10;");

</script>

<br>

<script type="text/javascript">

writeSelectBox(optionArray, "select3", 3, "alert(this.options[this.selectedIndex].value)", "margin-left: 10;");

</script>

 

 

 

 

 

 

 

 

 

 

 

 

<br><br><br><br>

<select onchange="if(this.options[this.selectedIndex].value!=&#39;&#39;){location=this.options[this.selectedIndex].value;}" >

<option value="http://www.163.com">网易</option>

<option value="http://www.google.com">google</option>

<option value="http://wwwsohu.com">搜狐</option>

</select>

 

 

<br><br><br><br>

<form>

<select size="1" name="D1" onchange=if(s=document.getElementById("S1")){s.style.backgroundColor=value}>

<option selected value="white">请选择颜色</option>

<option value="red">红色</option>

<option value="blue">蓝色</option>

<option value="green">绿色</option>

</select>

<br>

<textarea rows="20" name="S1" cols="35"></textarea>

 

</form>

 

<br><br>

Nach dem Login kopieren

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

323

324

325

326

327

328

329

330

331

332

333

334

335

336

337

338

339

340

341

342

343

344

345

346

347

348

349

350

351

352

353

354

355

356

357

358

359

360

361

362

363

364

365

366

367

368

369

370

371

372

373

374

375

376

377

378

379

380

381

382

383

384

385

386

387

388

389

390

391

392

393

394

395

396

397

398

399

400

401

402

403

404

405

406

407

408

409

410

411

412

413

414

415

416

417

418

419

420

421

<script language="Javascript">

var mmenus    = new Array();

var misShow   = new Boolean();

misShow=false;

var misdown   = new Boolean();

misdown=false;

var musestatus=false;

var mpopTimer = 0;

mmenucolor=&#39;#396DA5&#39;;mfontcolor=&#39;#80FFFF&#39;;mmenuoutcolor=&#39;#396DA5&#39;;mmenuincolor=&#39;#9595FF&#39;;mmenuoutbordercolor=&#39;#00FFFF&#39;;mmenuinbordercolor=&#39;#000000&#39;;mmidoutcolor=&#39;#269DC3&#39;;mmidincolor=&#39;#26486E&#39;;mmenuovercolor=&#39;#FFFF00&#39;;mitemedge=&#39;1&#39;;msubedge=&#39;0&#39;;mmenuunitwidth=60;mmenuitemwidth=160;mmenuheight=30;mmenuwidth=&#39;300&#39;;mmenuadjust=0;mmenuadjustV=0;mfonts=&#39;font-family: Verdana; font-size: 8pt; color: #80FFFF; &#39;;mcursor=&#39;default&#39;;

var swipeSteps = 4;

var swipemsec = 25;

var swipeArray = new Array();

function swipe(el, dir, steps, msec) {

    if (steps == null) steps = swipeSteps;

    if (msec == null) msec = swipemsec;

    if (el.swipeIndex == null)

        el.swipeIndex = swipeArray.length;

    if (el.swipeTimer != null)

        window.clearTimeout(el.swipeTimer);

    swipeArray[el.swipeIndex] = el;

    el.style.clip = "rect(-99999, 99999, 99999, -99999)";

    if (el.swipeCounter == null || el.swipeCounter == 0) {

        el.orgLeft  = el.offsetLeft;

        el.orgTop  = el.offsetTop;

        el.orgWidth = el.offsetWidth;

        el.orgHeight  = el.offsetHeight;

    }

    el.swipeCounter = steps;

    el.style.clip = "rect(0,0,0,0)";

    window.setTimeout("repeat(" + dir + "," + el.swipeIndex + "," + steps + "," + msec + ")", msec);

}

function repeat(dir, index, steps, msec) {

    el = swipeArray[index];

    var left   = el.orgLeft;

    var top    = el.orgTop;

    var width  = el.orgWidth;

    var height = el.orgHeight;

    if (el.swipeCounter == 0) {

        el.style.clip = "rect(-99999, 99999, 99999, -99999)";

        return;

    }

    else {

        el.swipeCounter--;

        el.style.visibility = "visible";

        switch (dir) {

            case 2:

                el.style.clip = "rect(" + height*el.swipeCounter/steps + "," + width + "," + height + "," + 0 + ")";

                el.style.top  = top - height*el.swipeCounter/steps;

                break;

            case 8:

                el.style.clip = "rect(" + 0 + "," + width + "," + height*(steps-el.swipeCounter)/steps + "," + 0 + ")";

                el.style.top  = top + height*el.swipeCounter/steps;

                break;

            case 6:

                el.style.clip = "rect(" + 0 + "," + width + "," + height + "," + width*(el.swipeCounter)/steps + ")";

                el.style.left  = left - width*el.swipeCounter/steps;

                break;

            case 4:

                el.style.clip = "rect(" + 0 + "," + width*(swipeSteps - el.swipeCounter)/steps + "," + height + "," + 0 + ")";

                el.style.left  = left + width*el.swipeCounter/steps;

                break;

        }

         

        el.swipeTimer = window.setTimeout("repeat(" + dir + "," + index + "," + steps + "," + msec + ")", msec);

    }

}

var mtmpleft="";

var mtmptop="";

function hideSwipe(el) {

    window.clearTimeout(el.swipeTimer);

    el.style.visibility = "hidden";

    el.style.clip = "rect(-99999, 99999, 99999, -99999)";

    el.swipeCounter = 0;

    if(mtmpleft!="")el.style.left = mtmpleft;

    if(mtmptop!="")el.style.top = mtmptop;

}

 

function stoperror(){

return true;

}

window.onerror=stoperror;

function mpopOut() {

mpopTimer = setTimeout(&#39;mallhide()&#39;, 500);

}

function getReal(el, type, value) {

    temp = el;

    while ((temp != null) && (temp.tagName != "BODY")) {

        if (eval("temp." + type) == value) {

            el = temp;

            return el;

        }

        temp = temp.parentElement;

    }

    return el;

}

 

 

function mMenuRegister(menu)

{

  mmenus[mmenus.length] = menu

  return (mmenus.length - 1)

}

function mMenuItem(caption,command,target,isline,statustxt,img,sizex,sizey,pos){

    this.caption=caption;

    this.command=command;

    this.target=target;

    this.isline=isline;

    this.statustxt=statustxt;

    this.img=img;

    this.sizex=sizex;

    this.sizey=sizey;

    this.pos=pos;

}

function mMenu(caption,command,target,img,sizex,sizey,pos){

    this.items = new Array();

    this.caption=caption;

    this.command=command;

    this.target=target;

    this.img=img;

    this.sizex=sizex;

    this.sizey=sizey;

    this.pos=pos;

    this.id=mMenuRegister(this);

}

function mMenuAddItem(item)

{

  this.items[this.items.length] = item

  item.parent = this.id;

  this.children=true;

}

 

mMenu.prototype.addItem = mMenuAddItem;

function mtoout(src){

 

src.style.borderLeftColor=mmenuoutbordercolor;

src.style.borderRightColor=mmenuinbordercolor;

src.style.borderTopColor=mmenuoutbordercolor;

src.style.borderBottomColor=mmenuinbordercolor;

src.style.backgroundColor=mmenuoutcolor;

src.style.color=mmenuovercolor;

}

function mtoin(src){

 

src.style.borderLeftColor=mmenuinbordercolor;

src.style.borderRightColor=mmenuoutbordercolor;

src.style.borderTopColor=mmenuinbordercolor;

src.style.borderBottomColor=mmenuoutbordercolor;

src.style.backgroundColor=mmenuincolor;

src.style.color=mmenuovercolor;

}

function mnochange(src){

src.style.borderLeftColor=mmenucolor;

src.style.borderRightColor=mmenucolor;

src.style.borderTopColor=mmenucolor;

src.style.borderBottomColor=mmenucolor;

src.style.backgroundColor=&#39;&#39;;

src.style.color=mfontcolor;

 

}

function mallhide(){

    for(var nummenu=0;nummenu<mmenus.length;nummenu++){

        var themenu=document.all[&#39;mMenu&#39;+nummenu]

        var themenup=document.all[&#39;mmenup&#39;+nummenu]

                mnochange(themenu);

                mmenuhide(themenup);

                }

}

function mmenuhide(menuid){

 

hideSwipe(menuid);

misShow=false;

}

function mmenushow(menuid,pid){

 

menuid.style.left=mmenutable.offsetLeft+pid.offsetLeft+mmenuadjust;menuid.style.top=mmenutable.offsetTop-menuid.offsetHeight+mmenuadjustV;

if(mmenuitemwidth+parseInt(menuid.style.left)>document.body.clientWidth+document.body.scrollLeft)

menuid.style.left=document.body.clientWidth+document.body.scrollLeft-mmenuitemwidth;

mtmpleft=menuid.style.left;mtmptop=menuid.style.top;swipe(menuid,8,4);

misShow=true;

}

function mmenu_over(menuid,x){

toel = getReal(window.event.toElement, "className", "coolButton");

fromel = getReal(window.event.fromElement, "className", "coolButton");

if (toel == fromel) return;

if(x==4){

  misShow = false;

  mallhide();

  mtoout(eval("mMenu"+x));

}else{

if(!misShow){mtoout(eval("mMenu"+x));}else{

  mallhide();

  mtoin(eval("mMenu"+x));

  mmenushow(menuid,eval("mMenu"+x));

}

}

 

}

function mmenu_out(x){

toel = getReal(window.event.toElement, "className", "coolButton");

fromel = getReal(window.event.fromElement, "className", "coolButton");

if (toel == fromel) return;

if (misShow){

mtoin(eval("mMenu"+x));

}else{

mnochange(eval("mMenu"+x));

}

 

}

function mmenu_down(menuid,x){

  if(misShow){

  mmenuhide(menuid);

  mtoout(eval("mMenu"+x));

  }

  else{

  mtoin(eval("mMenu"+x));

  mmenushow(menuid,eval("mMenu"+x));

  misdown=true;

  }

}

function mmenu_up(){

  misdown=false;

}

function mmenuitem_over(x,i){

srcel = getReal(window.event.srcElement, "className", "coolButton");

if(misdown){

    mtoin(srcel);

}

else{

mtoout(srcel);

}

mthestatus = mmenus[x].items[i].statustxt;

if(mthestatus!=""){

    musestatus=true;

    window.status=mthestatus;

}

 

}

function mmenuitem_out(){

srcel = getReal(window.event.srcElement, "className", "coolButton");

mnochange(srcel);

if(musestatus)window.status="";

 

}

function mmenuitem_down(){

srcel = getReal(window.event.srcElement, "className", "coolButton");

mtoin(srcel)

misdown=true;

}

function mmenuitem_up(){

srcel = getReal(window.event.srcElement, "className", "coolButton");

mtoout(srcel)

misdown=false;

}

function mexec2(x){

var cmd;

if(mmenus[x].target=="blank"){

  cmd = "window.open(&#39;"+mmenus[x].command+"&#39;)";

}else{

  cmd = mmenus[x].target+".location=\""+mmenus[x].command+"\"";

}

eval(cmd);

}

function mexec(x,i){

var cmd;

if(mmenus[x].items[i].target=="blank"){

  cmd = "window.open(&#39;"+mmenus[x].items[i].command+"&#39;)";

}else{

  cmd = mmenus[x].items[i].target+".location=\""+mmenus[x].items[i].command+"\"";

}

eval(cmd);

}

function mbody_click(){

 

if (misShow){

    srcel = getReal(window.event.srcElement, "className", "coolButton");

    for(var x=0;x<=mmenus.length;x++){

        if(srcel.id=="mMenu"+x)

        return;

    }

    mallhide();

}

}

document.onclick=mbody_click;

function mwritetodocument(){

      var mwb=1;

                     var stringx=&#39;<table  id=mmenutable border=0 cellpadding=3 cellspacing=2 width=&#39;+mmenuwidth+&#39; height=&#39;+mmenuheight+&#39; bgcolor=&#39;+mmenucolor+

                     &#39; onselectstart="event.returnValue=false"&#39;+

                     &#39; style="position:absolute;cursor:&#39;+mcursor+&#39;;&#39;+mfonts+

                     &#39; border-left: &#39;+mwb+&#39;px solid &#39;+mmenuoutbordercolor+&#39;;&#39;+

                     &#39; border-right: &#39;+mwb+&#39;px solid &#39;+mmenuinbordercolor+&#39;; &#39;+

                     &#39;border-top: &#39;+mwb+&#39;px solid &#39;+mmenuoutbordercolor+&#39;; &#39;+

                     &#39;border-bottom: &#39;+mwb+&#39;px solid &#39;+mmenuinbordercolor+&#39;; padding:0px"><tr>&#39;

                     for(var x=0;x<mmenus.length;x++){

                        var thismenu=mmenus[x];

                        var imgsize="";

                        if(thismenu.sizex!="0"||thismenu.sizey!="0")imgsize=" width="+thismenu.sizex+" height="+thismenu.sizey;

                        var ifspace="";

                        if(thismenu.caption!="")ifspace=" ";

                        stringx += "<td nowrap class=coolButton id=mMenu"+x+" style=&#39;border: "+mitemedge+"px solid "+mmenucolor+

                        "&#39; width="+mmenuunitwidth+"px onmouseover=mmenu_over(mmenup"+x+

                        ","+x+") onmouseout=mmenu_out("+x+

                        ") onmousedown=mmenu_down(mmenup"+x+","+x+")";

                              if(thismenu.command!=""){

                                  stringx += " onmouseup=mmenu_up();mexec2("+x+");";

                              }else{

                                  stringx += " onmouseup=mmenu_up()";

                              }

                              if(thismenu.pos=="0"){

                                  stringx += " align=center><img align=absmiddle src=&#39;"+thismenu.img+"&#39;"+imgsize+">"+ifspace+thismenu.caption+"</td>";  

                              }else if(thismenu.pos=="1"){

                                  stringx += " align=center>"+thismenu.caption+ifspace+"<img align=absmiddle src=&#39;"+thismenu.img+"&#39;"+imgsize+"></td>";  

                              }else if(thismenu.pos=="2"){

                                  stringx += " align=center background=&#39;"+thismenu.img+"&#39;> "+thismenu.caption+" </td>";   

                              }else{

                                  stringx += " align=center> "+thismenu.caption+" </td>";

                              }

                        stringx += "";

                     }

                     stringx+="<td width=*> </td></tr></table>";

                      

                      

                     for(var x=0;x<mmenus.length;x++){

                        thismenu=mmenus[x];

                        if(x==4){

                        stringx+=&#39;<p id=mmenup&#39;+x+&#39; style="visiable:none"></p>&#39;;

                        }else{

                        stringx+=&#39;<p id=mmenup&#39;+x+

                        &#39; style="cursor:&#39;+mcursor+&#39;;position:absolute;&#39;+

                        &#39;width:&#39;+mmenuitemwidth+&#39;px; z-index:&#39;+(x+100);

                        if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0"){

                        stringx+=&#39;;border-left: 1px solid &#39;+mmidoutcolor+

                        &#39;;border-top: 1px solid &#39;+mmidoutcolor;}

                        stringx+=&#39;;border-right: 1px solid &#39;+mmenuinbordercolor+

                        &#39;;border-bottom: 1px solid &#39;+mmenuinbordercolor+&#39;;visibility:hidden" onselectstart="event.returnValue=false">\n&#39;+

                        &#39;<table  width="100%" border="0" height="100%" align="center" cellpadding="0" cellspacing="2" &#39;+

                        &#39;style="&#39;+mfonts+&#39; border-left: 1px solid &#39;+mmenuoutbordercolor;

                        if(mmenuinbordercolor!=mmenuoutbordercolor&&msubedge=="0"){

                        stringx+=&#39;;border-right: 1px solid &#39;+mmidincolor+

                        &#39;;border-bottom: 1px solid &#39;+mmidincolor;}

                        stringx+=&#39;;border-top: 1px solid &#39;+mmenuoutbordercolor+

                        &#39;;padding: 4px" bgcolor=&#39;+mmenucolor+&#39;>\n&#39;

                        for(var i=0;i<thismenu.items.length;i++){

                            var thismenuitem=thismenu.items[i];

                            var imgsize="";

                                if(thismenuitem.sizex!="0"||thismenuitem.sizey!="0")imgsize=" width="+thismenuitem.sizex+" height="+thismenuitem.sizey;

                                var ifspace="";

                                if(thismenu.caption!="")ifspace=" ";

                            if(!thismenuitem.isline){

                            stringx += "<tr><td class=coolButton style=&#39;border: "+mitemedge+"px solid "+mmenucolor+

                            "&#39; width=100% height=15px onmouseover=\"mmenuitem_over("+x+","+i+

                            ");\" onmouseout=mmenuitem_out() onmousedown=mmenuitem_down() onmouseup=";

                stringx += "mmenuitem_up();mexec("+x+","+i+"); ";

                if(thismenuitem.pos=="0"){

                                    stringx += "><img align=absmiddle src=&#39;"+thismenuitem.img+"&#39;"+imgsize+">"+ifspace+thismenuitem.caption+"</td></tr>";  

                                  }else if(thismenuitem.pos=="1"){

                                    stringx += ">"+thismenuitem.caption+ifspace+"<img align=absmiddle src=&#39;"+thismenuitem.img+"&#39;"+imgsize+"></td></tr>";  

                                  }else if(thismenuitem.pos=="2"){

                                    stringx += "background=&#39;"+thismenuitem.img+"&#39;>"+thismenuitem.caption+"</td></tr>";  

                                  }else{

                                    stringx += ">"+thismenuitem.caption+"</td></tr>";

                                  }

                }else{

                            stringx+=&#39;<tr><td height="1" background="hr.gif" onmousemove="clearTimeout(mpopTimer);"><img height="1" width="1" src="none.gif" border="0"></td></tr>\n&#39;;

                            }

                        }stringx+=&#39;</table>\n</p>&#39;

                        }

                         

                }

                 

                     document.write("<p align=&#39;left&#39;>"+stringx+"</p>");

}

function mcheckLocation(){

if(isNaN(mmenuwidth))mmenuwidth=document.body.clientWidth*parseInt(mmenuwidth.substring(0,3))/100;ym=eval(document.body.scrollTop)+document.body.clientHeight-mmenuheight-10;xm=eval(document.body.scrollLeft)+10;y=mmenutable.style.pixelTop;x=mmenutable.style.pixelLeft;if(Math.abs(ym-y)>1)mmenutable.style.pixelTop=y+=(ym-y)/5;else mmenutable.style.pixelTop=y=ym;if(Math.abs(xm-x)>1)mmenutable.style.pixelLeft=x+=(xm-x)/5;else mmenutable.style.pixelLeft=x=xm;setTimeout("mcheckLocation()",10);}

 

mpmenu1=new mMenu(&#39;File&#39;,&#39;&#39;,&#39;self&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;);

mpmenu1.addItem(new mMenuItem(&#39;New&#39;,&#39;javascript:alert(\\"New\\")&#39;,&#39;self&#39;,false,&#39;New&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu1.addItem(new mMenuItem(&#39;Open&#39;,&#39;javascript:alert(\\"Open\\")&#39;,&#39;self&#39;,false,&#39;Open&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu1.addItem(new mMenuItem(&#39;Save&#39;,&#39;javascript:alert(\\"Save\\")&#39;,&#39;self&#39;,false,&#39;Save&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu1.addItem(new mMenuItem(null,null,null,true));

mpmenu1.addItem(new mMenuItem(&#39;Exit&#39;,&#39;javascript:alert(\\"Exit\\")&#39;,&#39;self&#39;,false,&#39;Exit&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu2=new mMenu(&#39;Edit&#39;,&#39;&#39;,&#39;self&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;);

mpmenu2.addItem(new mMenuItem(&#39;Undo&#39;,&#39;javascript:alert(\\"Undo\\")&#39;,&#39;self&#39;,false,&#39;Undo&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu2.addItem(new mMenuItem(&#39;Forward&#39;,&#39;javascript:alert(\\"Forward\\")&#39;,&#39;self&#39;,false,&#39;Forward&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu2.addItem(new mMenuItem(null,null,null,true));

mpmenu2.addItem(new mMenuItem(&#39;Copy&#39;,&#39;javascript:alert(\\"Copy\\")&#39;,&#39;self&#39;,false,&#39;Copy&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu2.addItem(new mMenuItem(&#39;Paste&#39;,&#39;javascript:alert(\\"Paste\\")&#39;,&#39;self&#39;,false,&#39;Paste&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu3=new mMenu(&#39;Favorites&#39;,&#39;&#39;,&#39;self&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;);

mpmenu3.addItem(new mMenuItem(&#39;My Homepage&#39;,&#39;http://www.KnifeSoft.com&#39;,&#39;blank&#39;,false,&#39;Visit My Homepage&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu3.addItem(new mMenuItem(&#39;Yahoo&#39;,&#39;http://www.yahoo.com&#39;,&#39;blank&#39;,false,&#39;Visit Yahoo&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu4=new mMenu(&#39;Help&#39;,&#39;&#39;,&#39;self&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;);

mpmenu4.addItem(new mMenuItem(&#39;Contect&#39;,&#39;javascript:alert(\\"Contect\\")&#39;,&#39;self&#39;,false,&#39;Contect&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu4.addItem(new mMenuItem(&#39;Send me an email&#39;,&#39;mailto:support@knifesoft.com&#39;,&#39;self&#39;,false,&#39;Send me an email.&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu4.addItem(new mMenuItem(null,null,null,true));

mpmenu4.addItem(new mMenuItem(&#39;About&#39;,&#39;javascript:alert(\\"About\\")&#39;,&#39;self&#39;,false,&#39;About WebMenuShop&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;));

mpmenu4=new mMenu(&#39;KnifeSoft&#39;,&#39;http://www.knifesoft.com&#39;,&#39;self&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;,&#39;&#39;);

mwritetodocument();

mcheckLocation();

</script>

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

<br><br><br><br><br><br><br><br><br><br><br><br><br>

<SELECT onchange="window.open(this.value,&#39;&#39;,&#39;&#39;)"> <OPTION>产品快速导航</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=1&amp;CateId=1 selected>多媒体产品</OPTION> <OPTION value=http://www.tcl.com/03product/tv/chanpin-hid.htm>  DLP数字光显背投</OPTION> <OPTION value=http://www.tclking.com>  LCD液晶电视</OPTION> <OPTION value=http://www.tcl.com/03product/tv/chanpin-hid.htm>  数字高清背投</OPTION> <OPTION value=http://www.tcl.com/03product/tv/chanpin-pdp.htm>  PDP等离子电视</OPTION> <OPTION value=http://www.tcl.com/03product/tv/chanpin-crt.htm>  CRT高清彩电</OPTION> <OPTION value=03product/pro2.jsp?cateID=1&amp;CateId=61>  酒店电视</OPTION> <OPTION value=03product/pro2.jsp?cateID=1&amp;CateId=141>  乐华彩电</OPTION> <OPTION value=http://av.tcl.com/03products/List.asp?ListID=246>  视盘机</OPTION> <OPTION value=http://www.tcl.com/03product/mon/index.html>  监视器</OPTION> <OPTION value=http://www.tcl.com/03product/vw/index.html>  电视墙</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=11&amp;CateId=1>通讯产品</OPTION> <OPTION value=http://www.tclmobile.com.cn/mobile/product.jsp?catid=77>  手机</OPTION> <OPTION value=03product/pro2.jsp?cateID=11&amp;CateId=18>  电话机</OPTION> <OPTION value=03product/pro2.jsp?cateID=11&amp;CateId=19>  网络设备</OPTION> <OPTION value=03product/pro2.jsp?cateID=11&amp;CateId=293>  宽带产品</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=12&amp;CateId=1>数码产品</OPTION> <OPTION value=http://www.tcl-digital.com/product/family.asp>  家用电脑</OPTION> <OPTION value=http://www.tcl-digital.com/product/business.asp>  商用电脑</OPTION> <OPTION value=http://www.tcl-digital.com/product/notebook.asp>  笔记本电脑</OPTION> <OPTION value=http://www.tcl-digital.com/product/digital.asp>  DV产品</OPTION> <OPTION value=http://www.tcl-digital.com/product/digital.asp?Cateid=82>  MP3播放器</OPTION> <OPTION value=http://www.go-video.com.cn/html/productshow.asp?sortid=25&amp;sortid2=7>  MP4播放器</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=13&amp;CateId=1>家电产品</OPTION> <OPTION value=03product/pro2.jsp?cateID=13&amp;CateId=25>  电冰箱</OPTION> <OPTION value=03product/pro2.jsp?cateID=13&amp;CateId=26>  洗衣机</OPTION> <OPTION value=http://www.tclac.com/tclaccn/product/product.aspx>  空调</OPTION> <OPTION value=http://www.tclac.com/tclaccn/product/productlist6.aspx>  中央空调</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist1.aspx>  电饭煲</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist2.aspx>  电磁炉</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist3.aspx>  电风扇</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist4.aspx>  饮水机</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist5.aspx>  电暖器</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist6.aspx>  净水器</OPTION> <OPTION value=http://www.nanhaitcl.com/product/productlist7.aspx>  烧烤炉</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=14&amp;CateId=1>电气产品</OPTION> <OPTION value=http://www.tcl-elc.com/main/gb/product/index.jsp>  开关插座</OPTION> <OPTION value=http://www.tcl-lighting.com/products.asp>  照明产品</OPTION> <OPTION value=http://www.tclelec.com/product/product_ljfl.htm>  工业电器</OPTION> <OPTION value=03product/pro2.jsp?cateID=14&amp;CateId=161>  智能楼宇</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=15&amp;CateId=1>部品产品</OPTION> <OPTION value=http://www.asic.com.cn/cn/product.htm>  集成电路</OPTION> <OPTION value=http://www.tclrf.com/products/index.html>  高频头</OPTION> <OPTION value=http://www.tclbattery.com/china/product01.asp>  电池</OPTION> <OPTION style="BACKGROUND: #999; COLOR: #fff" value=03product/pro2.jsp?cateID=16&amp;CateId=1>文化产品</OPTION> <OPTION value=http://www.meikamusic.com/>  美卡音像</OPTION> <OPTION value=http://www.tcl-disc.com/tp.htm>  TCL光盘</OPTION></SELECT>

Nach dem Login kopieren

后来发展到其文字内容可以增、删、编、改,即可以编辑:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

<html>

 

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>EditSelect</title>

<script>

function isIE(){

a=navigator.appVersion.split(";")

b=a[1].split(" ")

return parseFloat(b[2])

}

 

if (isIE()<5.5)

{

     scHTML=&#39;<p id="selectcontent" class="selectp" style="visibility:hidden;"><!--<iframe id=selframe frameborder=0 height=100%></iframe>--><p id="selecthtml" class="selectcontent">selectáD表</p></p>&#39;

}

else

{

     scHTML=&#39;<p id="selectcontent" class="selectp" style="visibility:hidden;"><iframe id=selframe frameborder=0 height=100%></iframe><p id="selecthtml" class="selectcontent">selectáD表</p></p>&#39;

}

 

document.write(scHTML)

vDiv=selectcontent

vDivHtml=selecthtml

 

function editselect(name,size,defaulttext,width,height,readonly){

  var combo=this;

  this.options=new Array();

  this.oj=new Array();

  this.name=name;

  this.pname=name+&#39;_p&#39;;

  this.buttonname=name+&#39;_button&#39;;

  this.tablename=name+&#39;_table&#39;;

  this.htmltable=name+&#39;_html&#39;

  if (!height) this.height=0; else this.height=height

  if (width) this.width=width

  if (!size) size=8

  if (!defaulttext) defaulttext=""

  if (!readonly || readonly==0) {readonly="" }else {if (readonly==1) readonly="readonly style=cursor:default";this.readonly=1}

   

  esHTML=&#39;<p id=&#39;+this.pname+&#39;>&#39;

         +&#39;<table id=&#39;+this.tablename+&#39; cellpadding=0 cellspacing=0 class=select><tr><td bgcolor=#FFFFFF>&#39;

         +&#39;<input type=text class=selecttext size="&#39;+size+&#39;" name=&#39;+name+&#39; value="&#39;+defaulttext+&#39;" &#39;+readonly+&#39;><td><button class=selectbutton id=&#39;+this.buttonname+&#39;>6</td></tr></table>&#39;

         +&#39;</p>&#39;

  document.write(esHTML)

  this.sbutton=eval("document.all."+this.buttonname)

   

  if (this.readonly==1) eval("document.all."+this.name).onclick=function(){combo.show()} 

   

  this.sbutton.onclick=function(){combo.show()}

  this.show=function(){

    pDiv=eval(combo.pname)

    pTable=eval(combo.tablename)

    var vHTML=&#39;<table id=htmltable cellspacing="0" cellpadding="2" bgcolor="#ffffff" class="selecttable" width=100%>&#39;

    for (i=0;i<combo.options.length;i++)

      {

       vHTML+=&#39;<tr onmouseover="mo(this)" onmouseout="mu(this)" onclick="document.all.&#39;+combo.name+&#39;.value=this.innerText;selectcontent.style.visibility=\&#39;hidden\&#39;;&#39;+combo.oj[i]+&#39;"><td nowrap>&#39;+combo.options[i]

      }

     vHTML+="</table>"

    vDivHtml.innerHTML=vHTML

     

    vtop=pDiv.offsetTop+pDiv.offsetHeight

    vleft=pDiv.offsetLeft+2

     

     

    vParent = pDiv.offsetParent;

     while (vParent.tagName.toUpperCase() != "BODY")

 {

  vleft += vParent.offsetLeft;

  vtop += vParent.offsetTop;

  vParent = vParent.offsetParent;

 }

 

   var redge=document.body.clientWidth-vleft

   var bedge=document.body.clientHeight-vtop

  

    

 

 if (!combo.width) {vDiv.style.width=pTable.offsetWidth} else {vDiv.style.width=combo.width}

     

 

    if (combo.height==0)

      {

        vDiv.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

        vDivHtml.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

      }

      else

      {

         if (htmltable.offsetHeight>combo.height)

          {

            vDiv.style.pixelHeight=combo.height

            vDivHtml.style.pixelHeight=combo.height

 

 

            }

           else

           {

           

              vDiv.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

              vDivHtml.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

           }

    

       }

     

    vDivHtml.scrollTop=0

     

    if (redge<vDiv.offsetWidth)

      vDiv.style.left=vleft-1-(vDiv.offsetWidth-redge)

        else

      vDiv.style.left=vleft-1

       

 

   if (bedge<vDiv.offsetHeight)

    //vDiv.style.top=vtop-vDiv.offsetHeight-pDiv.offsetHeight

    vDiv.style.top=vtop-vDiv.offsetHeight+bedge

         else

      vDiv.style.top=vtop

       

     

    vDivHtml.style.width=parseInt(vDiv.style.width)

      vDiv.style.visibility="visible"

  }

   

  this.add=function(text,js){

     combo.options[combo.options.length]=text

     combo.oj[combo.oj.length]=js

 

  }

   

  this.clearall=function(){

  combo.options=new Array()

  }

 

  this.about=function(){

   

 }

}

 

 

function mo(obj){

obj.style.backgroundColor="#000099"

obj.style.color="#ffffff"

}

 

function mu(obj){

obj.style.backgroundColor=""

obj.style.color="#000000"

}

 

document.onmousedown=function(){

if (vDiv.style.visibility=="visible"){

mx=event.x + document.body.scrollLeft

my=event.y + document.body.scrollTop;

 

x1=vDiv.offsetLeft

y1=vDiv.offsetTop

 

x2=vDiv.offsetLeft+vDiv.offsetWidth

y2=vDiv.offsetTop+vDiv.offsetHeight

 

if (mx<x1 || my<y1 || x2<mx || y2<my)

   {

     vDiv.style.visibility=&#39;hidden&#39;

   }

}

}</script>

 

 

<style>

.selecttext{

border:0px

height: 16;

font-family:arial;

font-size:12px;

}

.selectbutton{

font-family:webdings;

font-size:10px;

height: 19;

width: 16;

border:1px solid #83A5EB;

line-height:0px;

padding-bottom:3px;

background-color:#D1E0FD

}

.selecttable{

font-family:arial;

font-size:12px;

cursor:default;

}

.selectcontent

{

position: absolute;

top:0;

left:0;

overflow:auto;

border:1px solid #000000

}

 

.selectp

{

position: absolute;

width:100;

overflow:hidden;

}

.select{

border-collapse: collapse;

border:1px solid #7F9DB9

}

</style>

</head>

 

<body bgcolor="#83A5EB" background="http://moodboy.com/puterjam/blog/attachments/month_0408/oldr_cs1.JPG">

 

 

<table border="0" width="100%">

 <tr>

  <td width="151" align="center"><font size="2">可编辑的Select</font></td>

  <td><script>

var sel1=new editselect("select1","25","可编辑的Select","");

sel1.add("这是一个可以编辑的Select")

sel1.add("支持CSS")

sel1.add("可以通过CSS,修改外形")

sel1.add("突破原来的Select诸多限制")

</script></td>

 </tr>

 <tr>

  <td width="151" align="center"><font size="2">长度可以随意修改

可以设置为只读</font></td>

  <td>

  <script>

var sel2=new editselect("select2","20","长度可以随意修改",250,82,1);

sel2.add("这是一个可以编辑的Select")

sel2.add("支持CSS")

sel2.add("可以通过CSS,修改外形")

 

sel2.add("作者:舜子制作")

sel2.add("MSN:puterjam@msn.com")

</script>

  </td>

 </tr>

 <tr>

  <td width="151" align="center"><font size="2">可以遮盖系统Select</font></td>

  <td>

  <script>

var sel3=new editselect("select3","25","可以遮盖系统Select","",41);

sel3.add("这是一个可以编辑的Select")

sel3.add("支持CSS")

sel3.add("可以通过CSS,修改外形")

sel3.add("突破原来的Select诸多限制")

</script>

  </td>

 </tr>

 <tr>

  <td width="151" align="right"> </td>

  <td><select><option>系统的Select</option></select> </td>

 </tr>

</table>

</body>

 

</html>

Nach dem Login kopieren

可编辑的select:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

按回车键输入新内容,按DEL删除选中内容<br>

<body bgcolor="#fef4d9" onload="s1.focus();">

<script language="JavaScript">

<!--

function catch_keydown(sel)

{

    switch(event.keyCode)

    {

        case 13:

            //Enter;

            sel.options[sel.length] = new Option("","",false,true);

            event.returnValue = false;

            break;

        case 27:

            //Esc;

            alert("text:" + sel.options[sel.selectedIndex].text + ", value:" + sel.options[sel.selectedIndex].value + ";");

            event.returnValue = false;

            break;

        case 46:

            //Delete;

            if(confirm("删除当前选项!?"))

            {

                sel.options[sel.selectedIndex] = null;

                if(sel.length>0)

                {

                    sel.options[0].selected = true;

                }

            }

            event.returnValue = false;

            break;

        case 8:

            //Back Space;

            var s = sel.options[sel.selectedIndex].text;

            sel.options[sel.selectedIndex].text = s.substr(0,s.length-1);

            event.returnValue = false;

            break;

    }

     

}

function catch_press(sel)

{

    sel.options[sel.selectedIndex].text = sel.options[sel.selectedIndex].text + String.fromCharCode(event.keyCode);

    event.returnValue = false;

}

//-->

</script>

<select name=s1 onkeydown="catch_keydown(this);" onkeypress="catch_press(this);" style="font-size:12px;"><option>---</option></select>

Nach dem Login kopieren

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

<SCRIPT LANGUAGE="Javascript">

function inputToSelect(text,value)

{

i=0;

while(document.all.sel.options[i])

{

   if(document.all.sel.options[i].text == text)

      return 0;

   i++;

}

var oOption = document.createElement("OPTION");

oOption.text=text;

oOption.value=value;

document.all.sel.add(oOption);

}

</SCRIPT>

 

<input name="inputx" value="请选择或输入相应内容" onclick="if(this.value==&#39;请选择或输入

 

相应内容&#39;){this.value=&#39;&#39;;}else{}" style="border-left:1px solid #000000;border-top:1px solid #000000;border-bottom:1px solid #000000;border-

 

right:0px solid #000000;width:134;height:22px;" autocomplete="off"><span

 

style="width:150;overflow:hidden">

    <select id="sel" style="width:150;margin-left:-134;border:1px solid #000000;border-left:0px;height:22px;"

 

onChange="inputx.value=value" onClick="inputToSelect(inputx.value,inputx.value)">

        <option value="111111111">111111111</option>

        <option value="汉字也可以">汉字也可以</option>

    </select>

</span>

Nach dem Login kopieren

为了让select里有更多的图片、css修饰及其他静、动态修饰效果,而select本身优先级别太高,其修饰效果很少且不能满足上述要求,遂涌现出很多模拟的select:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title></title>

<style type="text/css">

<!--

.n1 {

    border-right: 1px none #999999;

    border-top: 1px solid #999999;

    border-bottom: 1px solid #DBDBDB;

    border-left: 1px solid #999999;

    cursor: default;

    width:80px

}

.n2 {

    background: url(http://www.blueidea.com/bbs/images/oicq.gif) no-repeat center center;

    border-top: 1px solid #999999;

    border-right: 1px solid #999999;

    border-bottom: 1px solid #DBDBDB;

    border-left: 1px none;

    width: 18px;

    cursor: default;

}

.ss {

    color: #FFFFFF;

    background: #0A246A;

}

-->

</style>

<script  lanuage="JScript">

function  turnit(ss)

{

 

  if  (ss.style.display=="none"

    {ss.style.display="";

    for (var i=1;i<4;i++)

{

if (eval(&#39;t&#39;+i).innerText==text1.value)

eval(&#39;t&#39;+i).className=&#39;ss&#39;

else

eval(&#39;t&#39;+i).className=&#39;&#39;

}

}

 

  else

    {ss.style.display="none";  

   }

}

function sele(tid)

{

bb.style.display=&#39;none&#39;;

text1.value=tid.innerText;

}

function over(tid)

{

for (var i=1;i<4;i++)

{

eval(&#39;t&#39;+i).className=&#39;&#39;

}

tid.className=&#39;ss&#39;

if(typeof(prevObj)!=&#39;undefined&#39;)

prevObj.bgColor=&#39;&#39;;

prevObj=tid;

}

 

function openb()

{

if (bb.style.display==&#39;&#39;)

bb.style.display=&#39;none&#39;

}

</script>

<style type="text/css">

<!--

table {

    font-size: 9pt;

}

-->

</style>

</head>

 

<body onclick=if(event.srcElement.tagName==&#39;BODY&#39;)bb.style.display=&#39;none&#39;;>

<table width="98" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="98" nowrap>

<input name="text1" type="text" size="10" class=n1 readonly value=请选择 onclick=turnit(bb) onSelectStart=event.returnValue=false><input name="Submit" type="text" class="n2" value="" readonly onclick=turnit(bb)>

       

    </td>

  </tr>

  <tr>

    <td id=bb style=display:none><p id="Layer1" style="position:absolute; width:98px; height:100px; overflow: scroll; overflow-x:hidden; z-index: 1;" class="n1">

        <table width="100%" border="0" cellpadding="0" cellspacing="0" id=tb onSelectStart=event.returnValue=false>

          <tr>

            <td  id=t1 onMouseOver =over(this)  onclick=sele(this)>选择1</td>

          </tr>

          <tr>

            <td id=t2 onMouseOver =over(this)  onclick=sele(this)>选择2</td>

          </tr>

          <tr>

            <td id=t3 onMouseOver =over(this)  onclick=sele(this)>选择3</td>

          </tr>

          

        </table>

      </p></td>

  </tr>

</table>

</body>

</html>

Nach dem Login kopieren

1

2

<center><sup><font face="隶书" color="blue">上标是不是这个?</font></sup><font size="6" face="华文行楷" color="red">如果要想以其他的文字作为上标该怎么做啊?</font><sub><font face="黑体" color="green"><b><i>下标是不是这个?</b></i></font></sub>

<br><br>

Nach dem Login kopieren

下面这两个已达到较高的水准(动态内容):

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

<html>

 

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>EditSelect</title>

<script>

scHTML=&#39;<p id="selectcontent" class="selectp" style="visibility:hidden;"><iframe id=selframe frameborder=0 height=100%></iframe><p id="selecthtml" class="selectcontent">select&Aacute;&ETH;±í</p></p>&#39;

document.write(scHTML)

vDiv=selectcontent

vDivHtml=selecthtml

 

function editselect(name,size,defaulttext,width,height,readonly){

  var combo=this;

  this.options=new Array();

  this.name=name;

  this.pname=name+&#39;_p&#39;;

  this.buttonname=name+&#39;_button&#39;;

  this.tablename=name+&#39;_table&#39;;

  this.htmltable=name+&#39;_html&#39;

   

  if (!height) this.height=0; else this.height=height

  if (width) this.width=width

  if (!size) size=8

  if (!defaulttext) defaulttext=""

  if (!readonly || readonly==0) {readonly="" }else {if (readonly==1) readonly="readonly style=cursor:default";this.readonly=1}

   

  esHTML=&#39;<p id=&#39;+this.pname+&#39;>&#39;

         +&#39;<table id=&#39;+this.tablename+&#39; cellpadding=0 cellspacing=0 class=select><tr><td bgcolor=#FFFFFF>&#39;

         +&#39;<textarea type=text class=selecttext cols="&#39;+size+&#39;" rows="1" name=&#39;+name+&#39; value="&#39;+defaulttext+&#39;" contenteditable="false" &#39;+readonly+&#39;></textarea><td><button class=selectbutton id=&#39;+this.buttonname+&#39;>6</td></tr></table>&#39;

         +&#39;</p>&#39;

  document.write(esHTML)

  this.sbutton=eval("document.all."+this.buttonname)

   

  if (this.readonly==1) eval(this.name).onclick=function(){combo.show()}

   

  this.sbutton.onclick=function(){combo.show()}

  this.show=function(){

    pDiv=eval(combo.pname)

    pTable=eval(combo.tablename)

    var vHTML=&#39;<table id=htmltable cellspacing="0" cellpadding="2" bgcolor="#ffffff" class="selecttable" width=100%>&#39;

    for (i=0;i<combo.options.length;i++)

      {

       vHTML+=&#39;<tr onmouseover="mo(this)" onmouseout="mu(this)" onclick="document.all.&#39;+combo.name+&#39;.innerHTML=\&#39;\&#39;;var t=document.createElement(\&#39;span\&#39;);t.innerHTML=this.innerHTML;document.all.&#39;+combo.name+&#39;.appendChild(t);selectcontent.style.visibility=\&#39;hidden\&#39;"><td nowrap>&#39;+combo.options[i]

      }

     vHTML+="</table>"

    vDivHtml.innerHTML=vHTML

     

    vtop=pDiv.offsetTop+pDiv.offsetHeight

    vleft=pDiv.offsetLeft+1

     

     

    vParent = pDiv.offsetParent;

        while (vParent.tagName.toUpperCase() != "BODY")

    {

        vleft += vParent.offsetLeft;

        vtop += vParent.offsetTop;

        vParent = vParent.offsetParent;

    }

 

   var redge=document.body.clientWidth-vleft

   var bedge=document.body.clientHeight-vtop

  

     

 

    if (!combo.width) {vDiv.style.width=pTable.offsetWidth} else {vDiv.style.width=combo.width}

     

 

    if (combo.height==0)

      {

        vDiv.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

        vDivHtml.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

      }

      else

      {

         if (htmltable.offsetHeight>combo.height)

          {

            vDiv.style.pixelHeight=combo.height

            vDivHtml.style.pixelHeight=combo.height

 

 

            }

           else

           {

           

              vDiv.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

              vDivHtml.style.pixelHeight=parseInt(htmltable.offsetHeight)+2

           }

    

       }

     

    vDivHtml.scrollTop=0

     

    if (redge<vDiv.offsetWidth)

      vDiv.style.left=vleft-1-(vDiv.offsetWidth-redge)

        else

      vDiv.style.left=vleft-1

       

 

   if (bedge<vDiv.offsetHeight)

    //vDiv.style.top=vtop-vDiv.offsetHeight-pDiv.offsetHeight

    vDiv.style.top=vtop-vDiv.offsetHeight+bedge

         else

      vDiv.style.top=vtop

       

     

    vDivHtml.style.width=parseInt(vDiv.style.width)

      vDiv.style.visibility="visible"

  }

   

  this.add=function(text){

     combo.options[combo.options.length]=text

  }

   

  this.about=function(){

   

 }

}

 

 

function mo(obj){

obj.style.backgroundColor="#000099"

obj.style.color="#ffffff"

}

 

function mu(obj){

obj.style.backgroundColor=""

obj.style.color="#000000"

}

 

document.onmousedown=function(){

if (vDiv.style.visibility=="visible"){

mx=event.x + document.body.scrollLeft

my=event.y + document.body.scrollTop;

 

x1=vDiv.offsetLeft

y1=vDiv.offsetTop

 

x2=vDiv.offsetLeft+vDiv.offsetWidth

y2=vDiv.offsetTop+vDiv.offsetHeight

 

if (mx<x1 || my<y1 || x2<mx || y2<my)

   {

     vDiv.style.visibility=&#39;hidden&#39;

   }

}

}

</script>

 

 

<style>

.selecttext{

border:0px

height: 22;

font-family:arial;

font-size:14px;

overflow:hidden;

}

.selectbutton{

font-family:webdings;

font-size:10px;

height: 25;

width: 16;

border:1px solid #83A5EB;

line-height:0px;

padding-bottom:1px;

background-color:#D1E0FD

}

.selecttable{

font-family:arial;

font-size:12px;

cursor:default;

}

.selectcontent

{

position: absolute;

top:0;

left:0;

overflow:auto;

border:1px solid #000000

}

 

.selectp

{

position: absolute;

width:100;

overflow:hidden;

}

.select{

border-collapse: collapse;

border:1px solid #7F9DB9

}

</style>

</head>

 

<body bgcolor="#83A5EB" marginheight="0" marginwidth="0" topmargin="0" leftmargin="0">

 

<center>

<table border="0" width="234">

    <tr>

        <td width="151" align="center"><font size="2">可编辑的Select</font></td>

        <td><script>

var sel1=new editselect("select1","25","可编辑的Select","");

sel1.add("<marquee behavior=alternate><img src=&#39;http://www.blueidea.com/articleimg/bbsimg/icon6.gif&#39; align=&#39;absmiddle&#39;>  <B><font color=#22FF22>知</font><font color=#FF2222>往</font><font color=#001199>观</font><font color=#00fffa>来</font></B></marquee>")

sel1.add("<img src=&#39;http://www.blueidea.com/articleimg/bbsimg/icon7.gif&#39; align=&#39;absmiddle&#39;>  微风香水")

sel1.add("<img src=&#39;http://www.blueidea.com/articleimg/bbsimg/icon8.gif&#39; align=&#39;absmiddle&#39;>  阳光锈了")

sel1.add("<img src=&#39;http://www.blueidea.com/articleimg/bbsimg/icon9.gif&#39; align=&#39;absmiddle&#39;>  <B><font color=#22FF22>观</font><font color=#FF2222>往</font><font color=#001199>知</font><font color=#00fffa>来</font></B>")

</script></td>

    </tr>

    <tr>

        <td width="151" align="right"> </td>

        <td> </td>

    </tr>

</table>

Nach dem Login kopieren

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title></title>

<style type="text/css">

<!--

.n1 {

    border-right: 1px none #999999;

    border-top: 1px solid #999999;

    border-bottom: 1px solid #DBDBDB;

    border-left: 1px solid #999999;

    cursor: default;

    width:180px

}

.n2 {

    background: url(http://www.blueidea.com/bbs/images/newwin.gif) no-repeat center center;

    border-top: 1px solid #999999;

    border-right: 1px solid #999999;

    border-bottom: 1px solid #DBDBDB;

    border-left: 1px none;

    width: 18px;

    cursor: default;

}

.ss {

    color: #FFFFFF;

    background: #0A246A;

}

-->

</style>

<script  lanuage="JScript">

function  turnit(ss)

{

 

  if  (ss.style.display=="none"

    {ss.style.display="";

}

 

  else

    {ss.style.display="none";  

   }

}

function sele(tid)

{

bb.style.display=&#39;none&#39;;

text1.value=tid.innerText;

}

function over(tid)

{

for (var i=1;i<4;i++)

{

eval(&#39;t&#39;+i).className=&#39;&#39;

}

tid.className=&#39;ss&#39;

}

function out(tid)

{

if (bb.style.display!=&#39;none&#39;)

tid.className=&#39;&#39;

}

</script>

<style type="text/css">

<!--

table {

    font-size: 16pt;font-family:华文行楷;

}

-->

</style>

</head>

 

<body style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=green,endColorStr=white);SCROLLBAR-ARROW-COLOR: #fc0048;

 SCROLLBAR-TRACK-COLOR: #242400;

 SCROLLBAR-BASE-COLOR: #24b400;">

<table width="198" border="0" cellspacing="0" cellpadding="0" align="center">

  <tr>

    <td width="198" nowrap>

<input name="text1" type="text" size="20" class=n1 readonly value=这里头别无选择 onclick=turnit(bb) style="color:red;font-family:隶书;font-size:14px;text-align:center;background:yellow;"><input name="Submit" type="text" class="n2" value="" readonly onclick=turnit(bb)>

       

    </td>

  </tr>

  <tr>

    <td id=bb style=display:none><p id="Layer1" style="position:absolute; width:198px; height:100px; overflow: scroll; overflow-x:hidden; z-index: 1;SCROLLBAR-ARROW-COLOR: #fc0048;

 SCROLLBAR-TRACK-COLOR: #242400;

 SCROLLBAR-BASE-COLOR: #24b400;" class="n1" >

        <table width="100%" border="0" cellpadding="0" cellspacing="0" id=tb>

          <tr>

            <td  id=t1 onMouseOver =over(this) onMouseOut =out(this) onclick=sele(this) style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=lime,endColorStr=white);"><img src="http://www.blueidea.com/articleimg/usericon/hubro.gif" align="absmiddle">金翅擘海</td>

          </tr>

          <tr>

            <td id=t2 onMouseOver =over(this) onMouseOut =out(this) onclick=sele(this) style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=brown,endColorStr=white);"><img src="http://www.blueidea.com/articleimg/usericon/hubro.gif" align="absmiddle"><B><font color="#22FF22">知</font><font color="#FF2222">往</font><font color="#001199">观</font><font color="#00fffa">来</font></B></td>

          </tr>

          <tr>

            <td id=t3 onMouseOver =over(this) onMouseOut =out(this) onclick=sele(this) style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=darckblue,endColorStr=white);"><marquee behavior="alternate"><img src="http://www.blueidea.com/articleimg/usericon/hubro.gif" align="absmiddle">海阿洛瓦</marquee></td>

          </tr>

   

          <tr>

            <td  id=t1 onMouseOver =over(this) onMouseOut =out(this) onclick=sele(this) style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=pink,endColorStr=white);"><img src="http://www.blueidea.com/articleimg/usericon/hubro.gif" align="absmiddle">蓝色月光</td>

          </tr>

          <tr>

            <td id=t2 onMouseOver =over(this) onMouseOut =out(this) onclick=sele(this) style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=red,endColorStr=white);"><img src="http://www.blueidea.com/articleimg/usericon/hubro.gif" align="absmiddle"><B><font color="#22FF22">波</font><font color="#FFdd22">希</font><font color="#001199">米</font><font color="#00fffa">亚 </font></B></td>

          </tr>

          <tr>

            <td id=t3 onMouseOver =over(this) onMouseOut =out(this) onclick=sele(this) style="FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=green,endColorStr=white);"><marquee behavior="alternate"><img src="http://www.blueidea.com/articleimg/usericon/hubro.gif" align="absmiddle">红色黑客</marquee></td>

          </tr>

 

 

 

        

        </table>

      </p></td>

  </tr>

</table>

Nach dem Login kopieren

可以去掉下拉的小三角,但不可以无边框:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

<script>

function myjump(myObj){

myurl=myObj.options[myObj.selectedIndex].value;

window.open(myurl,"newwin","width=300,height=200");

}

</script>

<center>

<select name="menu1" size=3 onChange="myjump(menu1)" style="background-color:

 

#CCCCFF; color:#0000FF">

<option selected>文字链接</option>

<option value="http://www.bineon.com/bbs/">霓虹论坛</option>

<option value="http://www.ylqh.com">叶落秋寒</option>

</select>

Nach dem Login kopieren

鼠标移过来select自动下拉:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

<style>

<!--

td{font-size:12px; }

body{margin:0px; line-height:20px}

a:link    { color:#000000; text-decoration:none}

a:visited {color:#000000; text-decoration:none}

a:hover   { color:#FFFFFF; background-color:#003366; text-decoration:none}

 

a:active  {color:#FFFFFF; text-decoration:none}

-->

</style>

<script language="JavaScript" type="text/JavaScript">

<!--

function MM_reloadPage(init) {  //reloads the window if Nav4 resized

  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {

    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}

  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();

}

MM_reloadPage(true);

 

function MM_findObj(n, d) { //v4.01

  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

  if(!x && d.getElementById) x=d.getElementById(n); return x;

}

 

function MM_showHideLayers() { //v6.0

  var i,p,v,obj,args=MM_showHideLayers.arguments;

  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];

    if (obj.style) { obj=obj.style; v=(v==&#39;show&#39;)?&#39;visible&#39;:(v==&#39;hide&#39;)?&#39;hidden&#39;:v; }

    obj.visibility=v; }

}

//-->

</script>

<p id="Layer1" style="position:absolute; left:0px; top:0px; width:145px; height:20px; z-index:1; visibility: visible; background-color: #FFFFFF; layer-background-color: #FFFFFF; border: 1px none #000000;" onMouseMove="MM_showHideLayers(&#39;l2&#39;,&#39;&#39;,&#39;show&#39;)" onMouseOut="MM_showHideLayers(&#39;l2&#39;,&#39;&#39;,&#39;hide&#39;)"></p>

<p>

<select name="select">

  <option selected>鼠标移过来自动下拉</option>

    <option selected>鼠标移过来自动下拉</option>

</select>

<p id="l2" style="position:absolute; left:0px; top:20px; width:142px; border:1px solid #000;visibility: hidden; height: 80px; z-index: 2;" onMouseMove="MM_showHideLayers(&#39;l2&#39;,&#39;&#39;,&#39;show&#39;)" onMouseOut="MM_showHideLayers(&#39;l2&#39;,&#39;&#39;,&#39;hide&#39;)" onClick="MM_showHideLayers(&#39;l2&#39;,&#39;&#39;,&#39;hide&#39;)">

  <table width="100%" height="80"  border="0" cellpadding="0" cellspacing="0">

    <tr>

      <td onMouseOver="this.style.backgroundColor=&#39;#003366&#39;;this.style.color=&#39;#ffffff&#39;"  onMouseOut="this.style.backgroundColor=&#39;#FFFFFF&#39;;this.style.color=&#39;#000000&#39;" onClick="window.open(&#39;http://www.blueidea.com&#39;)" >蓝色月光</td>

    </tr>

    <tr>

      <td onMouseOver="this.style.backgroundColor=&#39;#003366&#39;;this.style.color=&#39;#ffffff&#39;"  onMouseOut="this.style.backgroundColor=&#39;#FFFFFF&#39;;this.style.color=&#39;#000000&#39;" onClick="window.open(&#39;http://www.blueidea.com&#39;)" >红色黑客</td>

    </tr>

    <tr>

      <td onMouseOver="this.style.backgroundColor=&#39;#003366&#39;;this.style.color=&#39;#ffffff&#39;"  onMouseOut="this.style.backgroundColor=&#39;#FFFFFF&#39;;this.style.color=&#39;#000000&#39;" onClick="window.open(&#39;http://www.blueidea.com&#39;)" >

 

 

 

 

<marquee behavior="alternate"><B><font color="#22FF22">知</font><font color="#FF2222">往</font><font color="#001199">观</font><font color="#00fffa">来</font></B></marquee>

 

 

 

 

 

 

</td>

    </tr>

    <tr>

      <td onMouseOver="this.style.backgroundColor=&#39;#003366&#39;;this.style.color=&#39;#ffffff&#39;"  onMouseOut="this.style.backgroundColor=&#39;#FFFFFF&#39;;this.style.color=&#39;#000000&#39;" onClick="window.open(&#39;http://www.blueidea.com&#39;)" >

 

 

 

 

 

 

 

 

 

 

 

 

 

 

<script language="javascript">

var pltsPop=null;

var pltsoffsetX = 10;

var pltsoffsetY = 15;

var pltsPopbg="#ffffee";

var pltsPopfg="#111111";

var pltsTitle="";

document.write(&#39;<p id=pltsTipLayer style="display: none;position: absolute; z-index:10001"></p>&#39;);

function pltsinits()

{

    document.onmouseover   = plts;

    document.onmousemove = moveToMouseLoc;

}

function plts()

var o=event.srcElement;

    if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};

    if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};

    pltsPop=o.dypop;

    if(pltsPop!=null&&pltsPop!=""&&typeof(pltsPop)!="undefined")

    {

    pltsTipLayer.style.left=-1000;

    pltsTipLayer.style.display=&#39;&#39;;

    var Msg=pltsPop.replace(/\n/g,"<br>");

    Msg=Msg.replace(/\0x13/g,"<br>");

    var re=/\{(.[^\{]*)\}/ig;

    if(!re.test(Msg))pltsTitle="Sheneyan";

    else{

      re=/\{(.[^\{]*)\}(.*)/ig;

      pltsTitle=Msg.replace(re,"$1")+" ";

      re=/\{(.[^\{]*)\}/ig;

      Msg=Msg.replace(re,"");

      Msg=Msg.replace("<br>","");}

      var attr=(document.location.toString().toLowerCase().indexOf("list.asp")>0?"nowrap":"");

        var content =

        &#39;<table style="FILTER:alpha(opacity=80) shadow(color=#bbbbbb,direction=150);" id=toolTipTalbe border=0><tr><td width="100%"><table class=selet_bg cellspacing="0" cellpadding="0" style="width:100%" style="font size:9pt;">&#39;+

        &#39;<tr id=pltsPoptop><th height=12 valign=bottom class=header><p id=topleft align=left>↖&#39;+pltsTitle+&#39;</p><p id=topright align=right style="display:none">&#39;+pltsTitle+&#39;↗</font></th></tr>&#39;+

        &#39;<tr><td "+attr+" class=f_one style="padding-left:10px;padding-right:10px;padding-top: 4px;padding-bottom:4px;line-height:135%">&#39;+Msg+&#39;</td></tr>&#39;+

        &#39;<tr id=pltsPopbot style="display:none"><th height=12 valign=bottom class=header><p id=botleft align=left>↙&#39;+pltsTitle+&#39;</p><p id=botright align=right style="display:none">&#39;+pltsTitle+&#39;↘</font></th></tr>&#39;+

        &#39;</table></td></tr></table>&#39;;

        pltsTipLayer.innerHTML=content;

        toolTipTalbe.style.width=Math.min(pltsTipLayer.clientWidth,document.body.clientWidth/2.2);

        moveToMouseLoc();

        return true;

       }

    else

    {

        pltsTipLayer.innerHTML=&#39;&#39;;

        pltsTipLayer.style.display=&#39;none&#39;;

        return true;

    }

}

 

function moveToMouseLoc()

{

    if(pltsTipLayer.innerHTML==&#39;&#39;)return true;

    var MouseX=event.x;

    var MouseY=event.y;

    //window.status=event.y;

    var popHeight=pltsTipLayer.clientHeight;

    var popWidth=pltsTipLayer.clientWidth;

    if(MouseY+pltsoffsetY+popHeight>document.body.clientHeight)

    {

        popTopAdjust=-popHeight-pltsoffsetY*1.5;

        pltsPoptop.style.display="none";

        pltsPopbot.style.display="";

    }

     else

    {

        popTopAdjust=0;

        pltsPoptop.style.display="";

        pltsPopbot.style.display="none";

    }

    if(MouseX+pltsoffsetX+popWidth>document.body.clientWidth)

    {

        popLeftAdjust=-popWidth-pltsoffsetX*2;

        topleft.style.display="none";

        botleft.style.display="none";

        topright.style.display="";

        botright.style.display="";

    }

    else

    {

        popLeftAdjust=0;

        topleft.style.display="";

        botleft.style.display="";

        topright.style.display="none";

        botright.style.display="none";

    }

    pltsTipLayer.style.left=MouseX+pltsoffsetX+document.body.scrollLeft+popLeftAdjust;

    pltsTipLayer.style.top=MouseY+pltsoffsetY+document.body.scrollTop+popTopAdjust;

    return true;

}

pltsinits();

 

      </script>

 

 

<img border="0" alt="<img border=&#39;0&#39; src=&#39;http://pic1.blueidea.com/bbs/icon7.gif&#39;>" src="http://www.blueidea.com/articleimg/usericon/sheneyan.gif">

Nach dem Login kopieren
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Was soll ich tun, wenn ich auf den Codendruck auf Kleidungsstücke für Front-End-Thermalpapier-Quittungen stoße? Was soll ich tun, wenn ich auf den Codendruck auf Kleidungsstücke für Front-End-Thermalpapier-Quittungen stoße? Apr 04, 2025 pm 02:42 PM

Häufig gestellte Fragen und Lösungen für das Ticket-Ticket-Ticket-Ticket in Front-End im Front-End-Entwicklungsdruck ist der Ticketdruck eine häufige Voraussetzung. Viele Entwickler implementieren jedoch ...

Entmystifizieren JavaScript: Was es tut und warum es wichtig ist Entmystifizieren JavaScript: Was es tut und warum es wichtig ist Apr 09, 2025 am 12:07 AM

JavaScript ist der Eckpfeiler der modernen Webentwicklung. Zu den Hauptfunktionen gehören eine ereignisorientierte Programmierung, die Erzeugung der dynamischen Inhalte und die asynchrone Programmierung. 1) Ereignisgesteuerte Programmierung ermöglicht es Webseiten, sich dynamisch entsprechend den Benutzeroperationen zu ändern. 2) Die dynamische Inhaltsgenerierung ermöglicht die Anpassung der Seiteninhalte gemäß den Bedingungen. 3) Asynchrone Programmierung stellt sicher, dass die Benutzeroberfläche nicht blockiert ist. JavaScript wird häufig in der Webinteraktion, der einseitigen Anwendung und der serverseitigen Entwicklung verwendet, wodurch die Flexibilität der Benutzererfahrung und die plattformübergreifende Entwicklung erheblich verbessert wird.

Wer bekommt mehr Python oder JavaScript bezahlt? Wer bekommt mehr Python oder JavaScript bezahlt? Apr 04, 2025 am 12:09 AM

Es gibt kein absolutes Gehalt für Python- und JavaScript -Entwickler, je nach Fähigkeiten und Branchenbedürfnissen. 1. Python kann mehr in Datenwissenschaft und maschinellem Lernen bezahlt werden. 2. JavaScript hat eine große Nachfrage in der Entwicklung von Front-End- und Full-Stack-Entwicklung, und sein Gehalt ist auch beträchtlich. 3. Einflussfaktoren umfassen Erfahrung, geografische Standort, Unternehmensgröße und spezifische Fähigkeiten.

Wie fusioniere ich Arrayelemente mit derselben ID mit JavaScript in ein Objekt? Wie fusioniere ich Arrayelemente mit derselben ID mit JavaScript in ein Objekt? Apr 04, 2025 pm 05:09 PM

Wie fusioniere ich Array -Elemente mit derselben ID in ein Objekt in JavaScript? Bei der Verarbeitung von Daten begegnen wir häufig die Notwendigkeit, dieselbe ID zu haben ...

Ist JavaScript schwer zu lernen? Ist JavaScript schwer zu lernen? Apr 03, 2025 am 12:20 AM

JavaScript zu lernen ist nicht schwierig, aber es ist schwierig. 1) Verstehen Sie grundlegende Konzepte wie Variablen, Datentypen, Funktionen usw. 2) Beherrschen Sie die asynchrone Programmierung und implementieren Sie sie durch Ereignisschleifen. 3) Verwenden Sie DOM -Operationen und versprechen Sie, asynchrone Anfragen zu bearbeiten. 4) Vermeiden Sie häufige Fehler und verwenden Sie Debugging -Techniken. 5) Die Leistung optimieren und Best Practices befolgen.

Wie kann man Parallax -Scrolling- und Element -Animationseffekte wie die offizielle Website von Shiseido erzielen?
oder:
Wie können wir den Animationseffekt erzielen, der von der Seite mit der Seite mit der offiziellen Website von Shiseido begleitet wird? Wie kann man Parallax -Scrolling- und Element -Animationseffekte wie die offizielle Website von Shiseido erzielen? oder: Wie können wir den Animationseffekt erzielen, der von der Seite mit der Seite mit der offiziellen Website von Shiseido begleitet wird? Apr 04, 2025 pm 05:36 PM

Diskussion über die Realisierung von Parallaxe -Scrolling- und Elementanimationseffekten in diesem Artikel wird untersuchen, wie die offizielle Website der Shiseeido -Website (https://www.shiseeido.co.jp/sb/wonderland/) ähnlich ist ...

Der Unterschied in der Konsole.log -Ausgabeergebnis: Warum unterscheiden sich die beiden Anrufe? Der Unterschied in der Konsole.log -Ausgabeergebnis: Warum unterscheiden sich die beiden Anrufe? Apr 04, 2025 pm 05:12 PM

Eingehende Diskussion der Ursachen des Unterschieds in der Konsole.log-Ausgabe. In diesem Artikel wird die Unterschiede in den Ausgabeergebnissen der Konsolenfunktion in einem Code analysiert und die Gründe dafür erläutert. � ...

Die Entwicklung von JavaScript: Aktuelle Trends und Zukunftsaussichten Die Entwicklung von JavaScript: Aktuelle Trends und Zukunftsaussichten Apr 10, 2025 am 09:33 AM

Zu den neuesten Trends im JavaScript gehören der Aufstieg von Typenkripten, die Popularität moderner Frameworks und Bibliotheken und die Anwendung der WebAssembly. Zukunftsaussichten umfassen leistungsfähigere Typsysteme, die Entwicklung des serverseitigen JavaScript, die Erweiterung der künstlichen Intelligenz und des maschinellen Lernens sowie das Potenzial von IoT und Edge Computing.

See all articles