Maison interface Web js tutoriel 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>

Copier après la connexion

日久天长之后,人们对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>

Copier après la connexion

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

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>

Copier après la connexion

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>

Copier après la connexion

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

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>

Copier après la connexion

可编辑的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>

Copier après la connexion

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>

Copier après la connexion

为了让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>

Copier après la connexion

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>

Copier après la connexion

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

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>

Copier après la connexion

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>

Copier après la connexion

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

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>

Copier après la connexion

鼠标移过来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">

Copier après la connexion
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Que dois-je faire si je rencontre l'impression de code brouillé pour les reçus en papier thermique frontal? Que dois-je faire si je rencontre l'impression de code brouillé pour les reçus en papier thermique frontal? Apr 04, 2025 pm 02:42 PM

Des questions et des solutions fréquemment posées pour l'impression de billets thermiques frontaux pour le développement frontal, l'impression de billets est une exigence commune. Cependant, de nombreux développeurs mettent en œuvre ...

Démystifier javascript: ce qu'il fait et pourquoi c'est important Démystifier javascript: ce qu'il fait et pourquoi c'est important Apr 09, 2025 am 12:07 AM

JavaScript est la pierre angulaire du développement Web moderne, et ses principales fonctions incluent la programmation axée sur les événements, la génération de contenu dynamique et la programmation asynchrone. 1) La programmation axée sur les événements permet aux pages Web de changer dynamiquement en fonction des opérations utilisateur. 2) La génération de contenu dynamique permet d'ajuster le contenu de la page en fonction des conditions. 3) La programmation asynchrone garantit que l'interface utilisateur n'est pas bloquée. JavaScript est largement utilisé dans l'interaction Web, les applications à une page et le développement côté serveur, améliorant considérablement la flexibilité de l'expérience utilisateur et du développement multiplateforme.

Qui est payé plus de python ou de javascript? Qui est payé plus de python ou de javascript? Apr 04, 2025 am 12:09 AM

Il n'y a pas de salaire absolu pour les développeurs Python et JavaScript, selon les compétences et les besoins de l'industrie. 1. Python peut être davantage payé en science des données et en apprentissage automatique. 2. JavaScript a une grande demande dans le développement frontal et complet, et son salaire est également considérable. 3. Les facteurs d'influence comprennent l'expérience, la localisation géographique, la taille de l'entreprise et les compétences spécifiques.

Comment fusionner les éléments du tableau avec le même ID dans un seul objet en utilisant JavaScript? Comment fusionner les éléments du tableau avec le même ID dans un seul objet en utilisant JavaScript? Apr 04, 2025 pm 05:09 PM

Comment fusionner les éléments du tableau avec le même ID dans un seul objet en JavaScript? Lors du traitement des données, nous rencontrons souvent la nécessité d'avoir le même ID ...

JavaScript est-il difficile à apprendre? JavaScript est-il difficile à apprendre? Apr 03, 2025 am 12:20 AM

Apprendre JavaScript n'est pas difficile, mais c'est difficile. 1) Comprendre les concepts de base tels que les variables, les types de données, les fonctions, etc. 2) Master la programmation asynchrone et les implémenter via des boucles d'événements. 3) Utilisez les opérations DOM et promettez de gérer les demandes asynchrones. 4) Évitez les erreurs courantes et utilisez des techniques de débogage. 5) Optimiser les performances et suivre les meilleures pratiques.

Comment réaliser des effets de défilement de parallaxe et d'animation des éléments, comme le site officiel de Shiseido?
ou:
Comment pouvons-nous réaliser l'effet d'animation accompagné d'un défilement de page comme le site officiel de Shiseido? Comment réaliser des effets de défilement de parallaxe et d'animation des éléments, comme le site officiel de Shiseido? ou: Comment pouvons-nous réaliser l'effet d'animation accompagné d'un défilement de page comme le site officiel de Shiseido? Apr 04, 2025 pm 05:36 PM

La discussion sur la réalisation des effets de défilement de parallaxe et d'animation des éléments dans cet article explorera comment réaliser le site officiel de Shiseido (https://www.shiseido.co.jp/sb/wonderland/) ...

L'évolution de JavaScript: tendances actuelles et perspectives d'avenir L'évolution de JavaScript: tendances actuelles et perspectives d'avenir Apr 10, 2025 am 09:33 AM

Les dernières tendances de JavaScript incluent la montée en puissance de TypeScript, la popularité des frameworks et bibliothèques modernes et l'application de WebAssembly. Les prospects futurs couvrent des systèmes de type plus puissants, le développement du JavaScript côté serveur, l'expansion de l'intelligence artificielle et de l'apprentissage automatique, et le potentiel de l'informatique IoT et Edge.

La différence dans Console.Log de sortie Résultat: Pourquoi les deux appels sont-ils différents? La différence dans Console.Log de sortie Résultat: Pourquoi les deux appels sont-ils différents? Apr 04, 2025 pm 05:12 PM

Discussion approfondie des causes profondes de la différence de sortie Console.log. Cet article analysera les différences dans les résultats de sortie de la fonction Console.log dans un morceau de code et expliquera les raisons derrière. � ...

See all articles