在页面上执行sql语句，首先在页面上顶一个文本域，让用户输入需要执行的sql语句。

html代码如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
</head>
<body>
<div id ="defaultButtonBar" align="right" style="margin-right: 20px">
<button id="add" value="执行" onclick="find()" style="width: 100px;height: 30px;">执行</button>
</div> 
<div> 
输入的sql:<br><textarea id="sql" rows="6" style="width: 98%"></textarea>
</div>

<div id="divSql" style="color: red;height:400 "> <text id="str"></text></div>
</body>
</html>

然后最重要的是如何获取选中的文本并且让其在后台执行sql并返回信息给前台。

js代码如下：

/**
* 执行鼠标选中的文本（也就是sql语句）
*/
function find(){
　　var selectValue=null;
　　var sqlval=null;
　　if (document.selection){
　　　　selectValue=document.selection.createRange().text;//验证IE浏览器
　　} else if (window.getSelection){
　　　　// selectValue=window.getSelection();//其他浏览器
　　　　var obj = document.getElementById("sql");
　　　　var selstart = obj.selectionStart; //文字浮标选择的开始位置
　　　　var selend = obj.selectionEnd; //文字浮标选择的结束位置
　　　　selectValue= obj.value.substring(selstart,selend);
　　}
　　if(selectValue==null||selectValue==""){
　　　　var sqlval=document.getElementById("sql").value.toLocaleLowerCase();
　　}else{
　　　　sqlval=selectValue;
　　}
　　if(sqlval.indexOf("select")!=-1&&sqlval.indexOf("create")==-1){
　　sqlval = encodeURI(sqlval);
　　$.ajax({
　　type:'POST',
　　url:'findColumn',
　　data:"sqlval="+sqlval,
　　dataType:'text',
　　contentType:'application/x-www-form-urlencoded; charset=utf-8',
　　success: function(data){
　　　　var dataJson=eval('(' +data+ ')');
　　　　$("#str").text("");
　　　　$('#mytable').omGrid({
　　　　height : 400,
　　　　limit:0,
　　　　colModel :dataJson,
　　　　//contentType:'application/x-www-form-urlencoded; charset=utf-8',
　　　　dataSource:'findData.action?sqlval='+sqlval
　　});
　　}
　　, error:function(XMLResponse){
　　　　document.getElementById("tab").innerHTML="";
　　　　document.getElementById("tab").innerHTML='<table id="mytable"></table>';
　　　　var str=XMLResponse.responseText;
　　　　var str1=str.substring(str.indexOf("java"),str.lastIndexOf("</pre>"));
　　　　$("#str").text("");// 清空数据
　　　　$("#str").append(str1);
　　}
　　});
　　}else{
　　　　$.ajax({
　　　　type:'POST',
　　　　url:'updateAndDelete',
　　　　data:"sqlval="+sqlval,
　　　　dataType:'text',
　　　　limit:0,
　　　　contentType:'application/x-www-form-urlencoded; charset=utf-8',
　　　　success: function(data){
　　　　　　var dataJson=eval('(' +data+ ')');
　　　　　　$("#str").text("");
　　　　　　if(dataJson.update=='0002'){
　　　　　　　　alert("更新成功");
　　　　　　}else if(dataJson.del=='0001'){
　　　　　　　　alert("删除成功");
　　　　　　}else if(dataJson.insert=='0003'){
　　　　　　　　alert("插入数据成功");
　　　　　　}else if(dataJson.drop=='0004'){
　　　　　　　　alert("删除表成功");
　　　　　　else if(dataJson.create=='0005'){
　　　　　　　　alert("创建表成功");
　　　　　　}else{
　　　　　　　　alert("系统出错");
　　　　　　}
　　　　},error:function(XMLResponse){
　　　　　　var str=XMLResponse.responseText;
　　　　　　var str1=str.substring(str.indexOf("java"),str.lastIndexOf("</pre>"));
　　　　　　$("#str").text("");// 清空数据
　　　　　　$("#str").append(str1);
　　　　　}
　　　　});
　　}
}

关于后台代码这里就不展示了，无非就是执行前台传过来的sql语句并返回一些相应的信息

关于在页面上执行sql语句的更多相关文章

  1. Yii框架，在页面输出执行sql语句，方便调试

    1.下载yiidebugtb,并且放入到 application.extensions.yiidebugtb 目录 2.修改main.php,加入如下代码: 'log'=>array( 'cla ...

  2. 通过MyEclipse工具直接操作数据库，执行sql语句，方便快捷

    原文:通过MyEclipse工具直接操作数据库,执行sql语句,方便快捷 通过MyEclipse操作数据库,执行sql语句使我们不用切换多个工具,直接工作,方便快捷.效果如下: 步骤1:通过MyEcl ...

  3. ASP.NET MVC5+EF6+EasyUI 后台管理系统（89）-EF执行SQL语句与存储过程

    这一节,我们来看看EF如何执行SQL语句与读取存储过程的数据,可能有一部分人,还不知道EF如何执行存储过程与原生SQL语句! 我们什么时候要直接使用原生的SQL语句? 返回值过于复杂 过于复杂的联合查 ...

  4. 解决乱码的方法是，在执行SQL语句之前，将MySQL以下三个系统参数设置为与服务器字符集character-set-server相同的字符集

    character-set-server/default-character-set:服务器字符集,默认情况下所采用的. character-set-database:数据库字符集. characte ...

  5. easyui datagrid 禁止选中行 EF的增删改查（转载） C# 获取用户IP地址（转载） MVC EF 执行SQL语句（转载） 在EF中执行SQL语句（转载） EF中使用SQL语句或存储过程 .net MVC使用Session验证用户登录 PowerDesigner 参照完整性约束(转载)

    easyui datagrid 禁止选中行   没有找到可以直接禁止的属性,但是找到两个间接禁止的方式. 方式一: //onClickRow: function (rowIndex, rowData) ...

  6. 使用Hive或Impala执行SQL语句，对存储在HBase中的数据操作

    CSSDesk body { background-color: #2574b0; } /*! zybuluo */ article,aside,details,figcaption,figure,f ...

  7. 使用Hive或Impala执行SQL语句，对存储在Elasticsearch中的数据操作(二)

    CSSDesk body { background-color: #2574b0; } /*! zybuluo */ article,aside,details,figcaption,figure,f ...

  8. 使用Hive或Impala执行SQL语句，对存储在Elasticsearch中的数据操作

    http://www.cnblogs.com/wgp13x/p/4934521.html 内容一样,样式好的版本. 使用Hive或Impala执行SQL语句,对存储在Elasticsearch中的数据 ...

  9. [转]在EntityFramework6中执行SQL语句

    本文转自:http://www.cnblogs.com/wujingtao/p/5412329.html 在上一节中我介绍了如何使用EF6对数据库实现CRDU以及事务,我们没有写一句SQL就完成了所有 ...

随机推荐

  1. 用JavaScript将Canvas内容转化成图片的方法

    上周我们花了半天时间开发下一个准备放进Mozilla Marketplace的应用.有一个应用现在非常的火热,那就是Instagram,Facebook花了100万美元收购了它.我们也想有100万美元 ...

  2. nodejs学习随机记录

    1. nodejs的顶层对象:global(nodejs中没有window) 2. nodejs一个文件就是一个模块 每个模块都有自己的作用域 通过var声明的变量,只属于当前模块下,并非全局的 va ...

  3. Eloquent ORM 之关联查询

    小伙伴们好,本文是在我的前一篇随笔的基础上完成的,还没有浏览的同学,请移尊驾哦 Eloquent ORM学习笔记. 前一篇文章用到了leftJoin方法,其实Eloquent对于模块之间的关联查询有自 ...

  4. Leetcode 100 Same Tree python

    题目: Given two binary trees, write a function to check if they are equal or not. Two binary trees are ...

  5. humble number(hd1058)

    Problem Description A number whose only prime factors are 2,3,5 or 7 is called a humble number. The ...

  6. Android上使用OpenglES2.0遇到的一点问题

    按照教程开发OpenglES2.0应用,遇到Logcat报错“Called unimplemented OpenGL ES API” 在论坛和stackoverflow上找到了答案. 1.manife ...

  7. 测试框架mochajs详解

    测试框架mochajs详解 章节目录 关于单元测试的想法 mocha单元测试框架简介 安装mocha 一个简单的例子 mocha支持的断言模块 同步代码测试 异步代码测试 promise代码测试 不建 ...

  8. 定制化Azure站点Java运行环境(5)

    Java 8下PermGen及参数设置 在上一章节中,我们定制化使用了Java 8环境,使用我们的测试页面打印出了JVM基本参数,但如果我们自己观察,会发现在MXBeans中,没有出现PermGen的 ...

  9. Oracle EBS-SQL (CST-4):检查组织间项目成本.sql

    select       i1.segment1                                                                           项 ...

  10. WAS

    http://pic.dhe.ibm.com/infocenter/wasinfo/v8r0/index.jsp?topic=%2Fcom.ibm.websphere.express.doc%2Fin ...