`
zengbo0710
  • 浏览: 418157 次
社区版块
存档分类
最新评论

javascript判断页面名称的2种方法、JS歌词编辑器

阅读更多

javascript判断页面名称的2种方法:

1.var fname = window.location.href.match(/.+\/([^?]*)/)[1];

返回全名,如XXX.html

2.window.location.href.indexOf("文件名")!=-1

文件名可为menu_ , menu_1 ,menu_1.

var farr = new Array("index","menu_2","menu_3","menu_4","menu_5");
var flasharr = new Array("3","5","7","9","11");
//var fname = window.location.href.match(/.+\/([^?]*)/)[1];
var p = 3;

for (var i =0;i<5;i++){
 if (window.location.href.indexOf(farr[i])!=-1) {
  p = flasharr[i];
  break;
 }
}

JS歌词编辑器:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>歌词编辑器</title>
<style type="text/css">
<!--
body,td,th {
 font-size: 12px;
}
-->
</style></head>

<body>
<p>歌词编辑器</p>
<p>     第一步:选择要播放的歌曲并播放</p>
<p>    第二步:填写全部的歌词。</p>
<p>    第三步:添加时间标签。</p>
<p> 添加时间标记目的</p>
<p>    1、添加时间标签(插入到光标处)    </p>
<p>    2、转到下一行(光标转到下一个回车地方,当最后一个位置不为回车符时,直接将光标移到文本末尾) </p>
<p>删除时间标记算法:(删除光标所在行的时间标记)</p>
<p>删除所有时间标记算法:(替换所有的时间标记为空)</p>
<p>1、匹配时间标记</p>
<p>2、替换</p>
<p>播放器</p>
    
<object classid="clsid:6bf52a52-394a-11d3-b153-00c04f79faa6" id="player" width="480" height="240">
<param name="volume" value="100">
<param name="enablecontextmenu" value="0">
<param name="enableerrordialogs" value="0">
</object>
<p>    选择歌曲:
  <input type="file" name="file" onChange="PlayFile(this.value)">
</p>
<p>歌曲信息</p>
<p>     歌曲名:<span id="musicName" style="height:20">播放后显示</span></p>
<p>添加歌词(建议:第一步填写歌词文本;第二步添加时间标签)</p>
<p>     演唱者:
  <input name="singer" type="text" id="singer">
</p>
<p>     标 题:
  <input name="title" type="text" id="title">
</p>
<p>     编辑人:
  <input name="pepole" type="text" id="pepole">
</p>
<p>     专 辑:
  <input name="sing" type="text" id="sing">
</p>
<p>      内 容: </p>
<p>
        
      <textarea name="text" cols="50" rows="10" id="lrc"  onChange="storeCaret(this)" onKeyUp="storeCaret(this)" onClick="storeCaret(this)"></textarea>
</p>
  <p>
        
      <input id="a" type="button" name="Submit" value="添加时间标签" onClick="insertAtCaret(document.all('lrc'), 'hlayy');">
    <input  id="c" type="button" name="Submit2" value="删除时间标签" onClick="delTimeLable()">
    <input type="button" name="Submit3" value="删除所有时间标签" id="b" onClick="delAllTimeLable()">
</p>
  <p>生成歌词  </p>
  <p>        
    <textarea name="last" cols="50" rows="10" id="lastLrc" readonly="true"></textarea>
</p>
  <p>    
    <input type="button" name="Submit4" value="点击此处生成歌词" onClick="lastLrc();">
    <input type="button" name="Submit5" value="全选" onClick="document.all('lastLrc').select();">
  </p>
  <p>快捷键:(方便添加歌词)</p>
  <p>    1、播放歌曲</p>
  <p>    2、停止播放</p>
  <p>    3、暂停播放</p>
<p>| 版权:HLAYY | 作者:HLAYY | 联系QQ:42263646
  <script language="javascript">
  function lastLrc()
  {
  /*
  [ti:一直很安静]
 [ar:阿桑]
 [al:仙剑奇侠传电视原声带]
 [by:hlayy]
 */
   
 document.all("lastLrc").value="[ti:"+document.all("title").value+"]\r"+
         "[ar:"+document.all('singer').value+"]\r"+
          "[al:"+document.all('sing').value+"]\r"+
          "[by:"+document.all('pepole').value+"]\r"+
          document.all('lrc').value;
        
 
 
  }
 
  function storeCaret(textEl) {
   
    if (textEl.createTextRange)
 
    textEl.caretPos = document.selection.createRange().duplicate(); //创建一个文本区域的副本


 
 var slct = document.selection;
    var rng = slct.createRange();
 
    textEl.select();
    rng.setEndPoint("StartToStart", slct.createRange());
   
 
  psn = rng.text.length; //psn:光标的位置
 
 
    rng.collapse(false);
    rng.select();

 
  }

function findNext(value)
{
 //选择范围:以光标所在处为开始。以文本尾为结束
 //在范围内搜索指定的符号
 //i=光标开始处
 //for(i;i<文本长度;i++)
  //if(value==charAt(i))
  //break;
  //核心问题:当为回车时临近的两个坐标会显示同一值,所以,判断光标所在位置是否为‘回车’符。
  //如果是,则在判断时把光标的位置向右移一,即:加一。
  var textLength=document.all("lrc").value;
  var i=psn;//光标的位置
  var j=0;//在光标前出现回车的次数
  var z=0;//临时变量


    
  
if(value==textLength.charAt(i))
 i=i+1;
  // document.all("b").value=textLength.charAt(i);
 //else
 // document.all("b").value=textLength.charAt(i);
 
    for(z;z<i;z++)
  {
  if(value==textLength.charAt(z))
    ++j;

   
  
  }

 
  for(i;i<textLength.length;i++)
  {
   if(value==textLength.charAt(i))
   {

   movePoint(i-j+1);
   //document.all("a").value="zhixing";
    break;
   
    }
  
  
  }
  //document.all("c").value=textLength.length;
  //document.all("b").value=i;
  if(i==textLength.length&&value!=textLength.charAt(i))
  movePoint(textLength.length);
  //document.write('yes');
 
 


}


function PlayFile(url)
{
  player.url = url;//歌曲地址("player"为播放器ID)
  player.controls.play();//播放歌曲

  musicName.innerText=player.currentMedia.getItemInfo("Title");//显示歌曲信息(歌曲名)
}

function movePoint(value)
{
var pn = parseInt(value); //pn:移动到的位置

if(isNaN(pn))
return;

var rng = lrc.createTextRange(); //lrc:文本区域的ID;

rng.moveStart("character",pn);

rng.collapse(true);

rng.select();

}


  function insertAtCaret (textEl, text) {
 
    if (textEl.createTextRange && textEl.caretPos&&player.controls.currentPositionString!="")//当播放进度不为空,即:开始播放后
  {
    var caretPos = textEl.caretPos;
 caretPos.text="["+player.controls.currentPositionString+".00]";
 
  findNext("\r");
  } else
   
 alert('请先播放歌曲或者填写歌词文本!');
    //textEl.value = "";

 
  }
 
  function delAllTimeLable()
  {
  /*算法:
 ?、分离换行符
 ?、找到时间标记并删除
 
 
  */
      var originLrc=document.all("lrc").value;
    var last_Lrc;
    last_Lrc=originLrc.split("\n");
    var z=0;
    //document.all("a").value=originLrc.length;
    //document.all("c").value=last_Lrc.length;
    //document.all("b").value=psn;
 
   
    for(z;z<last_Lrc.length;z++)
    {
    //last_Lrc[z]=last_Lrc[z].substring((last_Lrc[z].lastIndexOf("]"))+1,last_Lrc[z].length);
   var start=last_Lrc[z].lastIndexOf("]")+1;
   var end=last_Lrc[z].length;
   last_Lrc[z]=last_Lrc[z].substring(start,end);
    }
   
   
   
    document.all("lrc").value="";
   
    var t=0;
    for(t;t<last_Lrc.length;t++)
    {
    if(t!=last_Lrc.length-1)
    document.all("lrc").value+=last_Lrc[t]+"\n";
    else
        document.all("lrc").value+=last_Lrc[t];
   
    //document.all("b").value=document.all("lrc").value.length;
    }

  }
 
  function delTimeLable()
  {
  /*算法:
  找到上一个时间标记并且删除
 
 ?、分离每行并存入数组;
 
 ?、判断光标在哪个数组里;
    取得光标位置
    光标前有多少个回车符可以得到在第几个数组
 
 ?、判断前面有或者没有时间标记
    如果有删除
    如果没有则保持不变
 
 
 
  */
 
 
    var caretPoss = (document.all("lrc")).caretPos;
 caretPoss.text=" ";
 
 
    var textLength=document.all("lrc").value;
  var i=psn;//光标的位置
  var j=0;//在光标前出现回车的次数
  var z=0;//临时变量
  
  
    var originLrc=document.all("lrc").value;
    var last_Lrc;
    last_Lrc=originLrc.split("\n");


 
 if('\r'==textLength.charAt(i))
 i=i+1;
 
    for(z;z<i;z++)
  {
  if('\r'==textLength.charAt(z))
    ++j;

   
  
  }
  
        var start=last_Lrc[j].lastIndexOf("]");
     if(start!=-1)
  last_Lrc[j]=last_Lrc[j].substring(start+1,last_Lrc[j].length);
  
  
  //去掉空格
        var start_1=last_Lrc[j].lastIndexOf(" ");
  if(start_1!=-1)
  {
  if(start_1==0)//如果在开头
  last_Lrc[j]=last_Lrc[j].substring(start_1+1,last_Lrc[j].length);
  else if(start_1==last_Lrc[j].length-1)//如果在结尾
  last_Lrc[j]=last_Lrc[j].substring(0,last_Lrc[j].length-1);
  else//如果在中间
     last_Lrc[j]=last_Lrc[j].substring(0,start_1)+last_Lrc[j].substring(start_1+1,last_Lrc[j].length);
  }
  
  
  
  
      document.all("lrc").value="";//清除文本区域内容
      //输出最后的内容
      var t=0;
    for(t;t<last_Lrc.length;t++)
    {
    if(t!=last_Lrc.length-1)
    document.all("lrc").value+=last_Lrc[t]+"\n";
    else
        document.all("lrc").value+=last_Lrc[t];

    }

 

 
 
  }
  //文本框按回车键产生的字符为‘\r\n’;

  </script> 
  | 时间:
 ?/2/27 | 版本:1.00 |</p>
<p></p>
</body>
</html>

 

分享到:
评论

相关推荐

    简单的js文本编辑器代码

    根据提供的文件信息,我们可以深入解析并提取出与“简单的js文本编辑器代码”相关的知识点。 ### 1. JavaScript函数定义及使用 #### 函数定义 在JavaScript中,可以通过`function`关键字来定义一个函数。例如,在...

    Fck编辑器API函数使用.doc

    - **检查内容是否变化**:使用`IsDirty`方法判断编辑器内容是否已被修改。 ```javascript var isChanged = oEditor.IsDirty(); ``` - **重置状态**:使用`ResetIsDirty`方法重置编辑器内容的变化状态。 ```...

    JS超级名著《Essentials of Javascript》

    - **鸭子类型**:JavaScript通过对象的属性和方法来判断对象的类型,而不是通过定义的数据类型。 - **原型继承**:JavaScript不使用传统的类继承模型,而是基于原型的对象继承机制。 ### JavaScript 语法 **...

    JavaScript网页特效范例宝典源码

    实例110 使用toLocaleString()方法获取本地时间 176 实例111 全中文显示日期 176 实例112 在状态栏中显示日期时间 178 实例113 使用数组显示星期 179 实例114 在表格中显示时间 180 实例115 退出页面时显示停留时间 ...

    Web前端大作业-个人网页(html+css+javascript)

    例如,轮播相册可能使用JavaScript来控制图片的切换,个人日志可能包含动态加载或编辑功能,天气查询可能通过调用API获取实时数据,而微电影页面可能包括播放、暂停和进度控制等视频功能。 【标签】...

    HTML和JavaScript的常用功能

    8. **设置标签是否可用(编辑器).html** - 使用JavaScript可以控制HTML元素的禁用状态,`element.disabled = true`将元素设置为不可用,`element.disabled = false`则恢复可用。 9. **DHTML创建Table.html** - 另一...

    JavaScript笔记

    可以使用任何文本编辑工具编写 JavaScript 代码,然后由浏览器解释执行。 JavaScript常用于实现如下功能: |--控制文档的外观和内容; |--对浏览器的控制; |--与 HTML 表单的交互; |--与用户的交互; |--...

    2020收集——泛微 Ecology流程表单常用JS脚本

    2. 泛微OA系统中,流程表单可以通过JS脚本获取当前登录用户的ID,使用方法var userid = wf__info.f_bel_userid或var userid = window.__userid。 3. 泛微OA系统支持通过流程节点操作菜单自定义名称的维护,相关表名...

    javascript 代码大全

    35. **执行菜单命令**:`obj.execCommand`执行富文本编辑器中的命令,如剪切、复制等。 36. **双字节字符检查**:正则表达式`/[^\x00-\xff]/`匹配非ASCII字符,`/[\u4e00-\u9fa5]/`匹配汉字。 37. **防止空链接...

    JavaScript习题库[参照].pdf

    JavaScript是一种广泛应用于网页和网络应用的轻量级编程语言,尤其在客户端脚本编写方面非常常见。它是由Netscape公司的Brendan Eich设计的,最初被称为Live Script,后来改名为JavaScript,以避免与Sun ...

    JavaScript参考教程

    - **开发工具**:推荐使用现代浏览器内置的开发者工具进行调试和测试,无需安装额外的IDE或编辑器即可进行JavaScript开发。 ##### 3. 语言基础 - **插入JavaScript的位置**:可以通过`&lt;script&gt;`标签将JavaScript...

    javascript非常全面的总结.doc

    JavaScript是一种广泛应用于Web开发的脚本语言,它在网页中主要负责实现动态效果、用户交互以及数据处理。本文档提供了一份详尽的JavaScript知识点总结,涵盖了事件处理、DOM操作、对象属性、编码与解码、样式修改等...

    JavaScript学习基础

    此外,熟悉一个良好的代码编辑器和理解不同浏览器之间的差异也有助于提升开发效率。随着学习的深入,可以进一步探索前端框架(如React、Vue、Angular)和Node.js后端开发,这将使你成为一名全面的Web开发者。

    javascript实用代码大全

    ### JavaScript实用代码大全:事件处理、DOM操作与高级功能 #### 一、事件处理与键盘交互 在JavaScript中,事件处理是与用户交互的核心部分。以下是一些关键的事件属性和方法: - **事件源**: `event.srcElement`...

    javascript技巧大全

    ### JavaScript技巧大全 在《JavaScript技巧大全》这篇文章中,作者主要介绍了JavaScript中一系列实用的技巧和技术,涵盖了事件处理、DOM操作、表单控制等多个方面。接下来我们将详细解析这些技巧的具体内容及其...

    极品网络编程技术教程

    2. **二Js在线网页编辑器制作入门例子.htm**:介绍如何使用JavaScript创建一个在线文本编辑器,可能包含对富文本编辑器API的使用和事件处理的讲解。 3. **js删除下拉菜单中的选定项.htm**:这部分内容可能涉及...

    jSon调用jsp页面,jsp页面中加载公司标签的实现过程(json 异步)

    开发过程中,你可能需要使用到一些工具,如开发者工具(Chrome DevTools或Firefox Developer Tools)来调试JavaScript和查看网络请求,还有代码编辑器(如Visual Studio Code或Sublime Text)来编写和格式化代码。...

    JS写的一个方块移动游戏

    JavaScript,通常简称为JS,是一种广泛应用于Web开发的脚本语言,它允许在浏览器端执行代码,为用户提供动态交互体验。这个游戏可能是基于HTML5的Canvas或者WebGL技术构建,这两者都是用来在网页上创建图形和动画的...

    javascript最常用的技巧

    JavaScript是一种广泛应用于网页和网络应用开发的脚本语言,它主要负责实现客户端的交互功能。以下是一些JavaScript中最常用的技术和技巧: 1. **事件源对象**:在JavaScript事件处理中,`event.srcElement`是IE...

Global site tag (gtag.js) - Google Analytics