如何使用textarea插入html和javascript代码

我想在我的数据库中插入带有textarea字段的html和JavaScript代码。 问题是代码已插入,但它用反弹替换了所有双重问题。 如何使用textarea插入此代码。 </ p>

&lt; div id =“TA_cdsratingsonlynarrow539”class =“TA_cdsratingsonlynarrow”&gt;&lt; ul id =“Ny62NY”class =“TA_links r04zlbt”&gt;&lt; li id = “jb9xdEapRG”class =“sc9nmfeVX”&gt;&lt; a target =“_ blank”href =“https://www.tripadvisor.com/”&gt;&lt; img src =“https://www.tripadvisor.com/ img / cdsi / img2 / branding / tripadvisor_logo_transp_340x80-18034-2.png“alt =”TripAdvisor“/&gt;&lt; / a&gt;&lt; / li&gt;&lt; / ul&gt;&lt; / div&gt;&lt; script src =” https://www.jscache.com/wejs?wtype=cdsratingsonlynarrow&amp;amp;uniq=539&amp;amp;locationId=671932&amp;amp;lang=en_US&amp;amp;border=false&amp;amp;shadow=false&amp;amp;display_version= 2“&gt;&lt; / script&gt; </ code> </ p>
</ div>

展开原文

原文

I want to insert html and JavaScript code with textarea field in my database. Problem is code has inserted but its replaced all double question with backlash. How to insert this code with textarea.

<div id="TA_cdsratingsonlynarrow539" class="TA_cdsratingsonlynarrow"><ul id="Ny62NY" class="TA_links r04zlbt"><li id="jb9xdEapRG" class="sc9nmfeVX"><a target="_blank" href="https://www.tripadvisor.com/"><img src="https://www.tripadvisor.com/img/cdsi/img2/branding/tripadvisor_logo_transp_340x80-18034-2.png" alt="TripAdvisor"/></a></li></ul></div><script src="https://www.jscache.com/wejs?wtype=cdsratingsonlynarrow&amp;uniq=539&amp;locationId=671932&amp;lang=en_US&amp;border=false&amp;shadow=false&amp;display_version=2"></script>

duanpu1064
duanpu1064 这个答案可能会有所帮助。
接近 3 年之前 回复

1个回答



可以使用textarea输入字段将html和javascript代码插入/注入当前页面。</ p>

考虑一下,你跟着textarea:</ p>

 &lt; div id =“output”&gt;&lt; / div&gt; 
&lt; div style =“margin:25px auto; width; 80%; height:auto;“&gt;
&lt; form id =”myform“name =”myform“&gt;
&lt; textarea id =”mytextarea“name =”mytextarea“cols =”90 “rows =”20“&gt;&lt; / textarea&gt;
&lt; br&gt; &lt; button type =“button”id =“mybutton”&gt;执行&lt; / button&gt;
&lt; / form&gt;
&lt; / div&gt;
</ code> </ pre>

现在,您可以向上面的按钮添加事件监听器,从textarea中提取html和javascript代码并将它们插入到页面中:</ p>

  window.addEventListener('load',function  (){
document.getElementById('mybutton')。addEventListener('click',function(e){
var mytextarea = document.getElementById('mytextarea');
var pattern = /&lt; script&gt;( [^] +?)&lt; \ / script&gt; / mg;
var matches,txt = mytextarea.value;
if(txt){
while(matches = pattern.exec(txt)){
if (匹配[1]){
var tContent = matches [1] .replace(/(
| )+ / gm,'');
var s = document.createElement('script'); \ n s.innerText = tContent;
document.body.appendChild(s);
}
}
txt = txt.replace(pattern,'');
}
if(txt){
document.getElementById('output')。innerHTML = txt;
}
});
});
</ code> </ pre>
</ div>

展开原文

原文

It is possible to insert/inject html and javascript code using textarea input field into the current page.

consider, you've following textarea:

<div id="output"></div>
<div style="margin: 25px auto; width: 80%; height: auto;">
    <form id="myform" name="myform">
        <textarea id="mytextarea" name="mytextarea" cols="90" rows="20"></textarea>
        <br> <button type="button" id="mybutton">execute</button>
    </form>
</div>

Now, you can add event listener to that above button to extract html and javascript code from the textarea and insert them to the page:

    window.addEventListener('load', function () {
        document.getElementById('mybutton').addEventListener('click', function (e) {
            var mytextarea = document.getElementById('mytextarea');
            var pattern = /<script>([^]+?)<\/script>/mg;
            var matches, txt = mytextarea.value;
            if (txt) {
                while (matches = pattern.exec(txt)) {
                    if (matches[1]) {
                        var tContent = matches[1].replace(/(
|)+/gm, '');
                        var s = document.createElement('script');
                        s.innerText = tContent;
                        document.body.appendChild(s);
                    }
                }
                txt = txt.replace(pattern, '');
            }
            if (txt) {
                document.getElementById('output').innerHTML = txt;
            }
        });
    });

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
Python+OpenCV计算机视觉

Python+OpenCV计算机视觉

无法使用php在textarea输入中存储的数据库中插入答案

<div class="post-text" itemprop="text"> <p>This file contains the code for search form:</p> <pre><code>search.php &lt;?php session_start(); ?&gt; &lt;html&gt; &lt;head&gt; &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"&gt; &lt;/head&gt; &lt;body&gt; &lt;?php echo"WELCOME ".strtoupper($_SESSION['user']); ?&gt; &lt;form method="get" action="searched.php"&gt; &lt;label for="ques"&gt;&lt;/label&gt; &lt;input type="text" name="title" id="title" placeholder="Search..."&gt; &lt;button type="submit" name="search"&gt;&lt;i class="fa fa-search"&gt;&lt;/i&gt;&lt;/button&gt; &lt;/form&gt; &lt;form method="post" action="question.php"&gt; &lt;button type="submit" name="ask_ques"&gt;Ask a Question&lt;/button&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>This file gets the input from search bar and displays the title with question and answer if any. It also contains a comment box to answer the question:</p> <pre><code>searched.php &lt;?php session_start(); ?&gt; &lt;html&gt; &lt;head&gt; &lt;/head&gt; &lt;body&gt; &lt;?php $conn=new mysqli("localhost","khushank","sethi","q&amp;a"); if($conn-&gt;connect_error){ echo "unable to connect"; } if($_SERVER['REQUEST_METHOD']=='GET'){ if(isset($_GET['search'])){ $title=$_GET['title']; $qsel=" SELECT title,qemail,ques FROM question WHERE title='$title' "; if($qresult=$conn-&gt;query($qsel)){ if($qresult-&gt;num_rows==0){ header('location:question.php'); } else{ while($qres=$qresult-&gt;fetch_assoc()){ echo "&lt;strong&gt;".ucfirst($qres['title'])."&lt;/strong&gt;&lt;br&gt;&lt;br&gt;"; echo $qres['qemail']; ?&gt; &lt;textarea cols="65" id="qdes"&gt;&lt;?php echo $qres['ques']; ?&gt;&lt;/textarea&gt;&lt;br&gt;&lt;br&gt; &lt;?php $asel=" SELECT answer.aemail,answer.ans FROM question JOIN answer ON question.ques=answer.ques "; if($aresult=$conn-&gt;query($asel)){ if($aresult-&gt;num_rows&gt;0){ while($ares=$aresult-&gt;fetch_assoc()){ echo"Answer:"; ?&gt; &lt;textarea cols="65" id="ades"&gt;&lt;?php echo $ares['ans']; ?&gt;&lt;/textarea&gt;&lt;br&gt;&lt;br&gt; &lt;?php } } ?&gt; &lt;form method="get" action="insertA.php?$ques='$qres['ques']'"&gt; &lt;label for="ans"&gt;&lt;?php echo $_SESSION['user']; ?&gt;&lt;/label&gt; &lt;textarea cols="90" name="ans" placeholder="Your Answer"&gt;&lt;/textarea&gt; &lt;input type="submit" name="comment" value="submit"&gt; &lt;/form&gt; &lt;?php } else{ echo "answer not selected"; } } } } else{ echo"not selected"; } } } $conn-&gt;close(); ?&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>In this file answer is stored using GET method, but unable to get inserted into the database:</p> <pre><code>insert.php &lt;?php require 'searched.php'; $conn=new mysqli("localhost","khushank","sethi","q&amp;a"); if($conn-&gt;connect_error){ echo "unable to connect"; } echo"connected"; if($_SERVER['REQUEST_METHOD']=='GET'){ if(isset($_GET['comment'])){ $ans=mysql_real_escape_string($_GET['ans']); $username=$_SESSION['user']; //$ques=$_GET['$ques']; $insa=" INSERT INTO answer(aemail,ans) VALUES('$username','$ans') " ; if($conn-&gt;query($insa)){ echo"inserted"; echo"&lt;script type='text/javascript'&gt;".'alert("your answer is posted successfully"); &lt;/script&gt;'; } else{ echo"not inserted"; } } } else{ echo"1"; } $conn-&gt;close(); ?&gt; </code></pre> <p>I'm unable to insert the values stored in <code>$ans</code>. </p> </div>

使用javascript将文本框数组添加到html中出错

<div class="post-text" itemprop="text"> <p>我的代码哪里错了?</p> <pre><code> &lt;script&gt; function add(){ /* Get your form */ form = document.getElementById("test"); /* Create your input element */ input = document.createElement("input"); input.type="text"; input.name="array['artists']"; /* Append to form */ form.appendChild(input); alert("done"); } &lt;/script&gt; &lt;table&gt; &lt;tr&gt; &lt;td align="right"&gt;Artist/s:&lt;/td&gt; &lt;td&gt;&lt;form id="test" enctype="multipart/data-form" method="post"&gt; &lt;input type="text" name="artists"/&gt; &lt;input type="button" onclick='javascript: add()'/&gt;&lt;/form&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td colspan="2"&gt;&lt;input type="submit" value="Submit"&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; </code></pre> <p>我试图在另一个文本框下面添加另一个文本框,但是什么也没有发生。我该怎么做?</p> </div>

这是我将数据插入数据库的代码...但它不会插入到数据库中

<div class="post-text" itemprop="text"> <p>I want to insert product details into database, but it doesn't get added into database also I get this error </p> <blockquote> <p>"Notice: A session had already been started - ignoring session_start() in C:\xampp\htdocs egal\admin\insert_products.php on line 2"</p> </blockquote> <pre class="lang-html prettyprint-override"><code>&lt;?php session_start(); echo "WELCOME: "."&lt;b&gt;". $_SESSION['user']."&lt;/br&gt;"; if(!isset($_SESSION['ISLOGIN'])){ echo "&lt;script&gt;window.open('login.php?log=NOT AN ADMIN!!','_self')&lt;/script&gt;"; die; } else{ ?&gt; &lt;!doctype&gt; &lt;?php include("./include/db.php"); ?&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;INSERT PRODUCTS&lt;/title&gt; &lt;script src="//cdn.tinymce.com/4/tinymce.min.js"&gt;&lt;/script&gt; &lt;script&gt;tinymce.init({ selector:'textarea' });&lt;/script&gt; &lt;/head&gt; &lt;body bgcolor="black"&gt; &lt;form method="post" action="insert_products.php" enctype="multipart/form-data"&gt; &lt;table width="830" height="600px" bgcolor="gray" align="center" border="5" style="color:white" &gt; &lt;tr &gt; &lt;th colspan="7" align="center"&gt;&lt;h1&gt;Insert New Posts Here!&lt;/h1&gt;&lt;/th&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="right" &gt;&lt;b&gt;NAME:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;input type="text" name="name" required/&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr &gt; &lt;td align="right" &gt;&lt;b&gt;IMAGE:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;input type="file" name="img" required/&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="right" &gt;&lt;b&gt;PRICE:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;input type="text" name="price" required/&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="right" /&gt;&lt;b&gt;CATEGORY:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;select name="getcat" required/&gt; &lt;option&gt;Select&lt;/option&gt; &lt;?php if (!$db) { echo "Error: Unable to connect to MySQL."; exit; } $q="select * from cat" ; $run_cat=mysql_query($q); while($rows=mysql_fetch_array($run)){ $catid=$rows['id']; $cattit=$rows['title']; echo "&lt;option&gt;$cattit&lt;/option&gt;"; } ?&gt; &lt;/select&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr &gt; &lt;td align="right" &gt;&lt;b&gt;DESCIRPTION:&lt;/b&gt;&lt;/td&gt; &lt;td&gt;&lt;textarea type="text" name="desc" cols="20" rows="10"&gt;&lt;/textarea&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="center" colspan="7"&gt;&lt;input type="submit" name="sub" value="Insert Product"&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; &lt;?php if(isset($_POST['sub'])){ $name=$_POST['name']; $price=$_POST['price']; $getcat=$_POST['getcat']; $desc=$_POST['desc']; $img=$_FILES['img']['name']; $imgt=$_FILES['img']['tmp_name']; move_uploaded_file($imgt,"pro-images/$img"); $insert="insert into products (img,price,name,category,desc)values ('$img','$price','$name','$getcat','$desc')"; $insert_pro=mysql_query($insert); if($insert_pro){ echo "&lt;script&gt;alert('PRODUCT HAS BEEN UPLOADED')&lt;/script&gt;"; echo"&lt;script&gt;window.open('index.php?insertprod','_self')&lt;/script&gt;"; } } } ?&gt; </code></pre> </div>

Jquery 怎么获取动态生成的html元素,然后给其中的元素添加样式?

这是其中界面的js代码,主要去了异步去后台加载数据,然后动态写li元素及里边的a元素 [code="javascript"]$.ajax({ url: "home!subMenu", typ:"post", datatype:"json", data:{"fatherId":${request.fatherId}}, success:function(data) { if(data.success) { var json = eval(data); var menu = json.tree; var html ="<li class='space'></li>"; $.each(menu,function(i,item) { html=html+"<li><a href='javascript:;' hint='merchant' action='"+item['url']+"?fatherId="+item['fatherId'] +"' class='merchantmenu'>" +item['text']+"</a></li>" }); $("#merchantSubMenu").append(html); } else { art.dialog(data.message); document.location.href="home!gotoIndex";//跳转到首页 } } }); $('a[class="merchantmenu"]').each(function(){ alert("test");//这里进不来。。。。 });[/code] 我现在想要获取这个li列表的第一个元素给添加样式。 现在的问题 通过选择器获取不到,是ajax异步加载还没写进去吗?

重赏!关于markdown代码编辑器的实时高亮

应公司要求必须自己用js写个markdown功能!谁知道用什么文本框来进行输入!我试过 可编辑div 但是光标出现很多问题!用textarea怎么插入html来进行实时关键字匹配高亮呢。 有具体代码和思路做法吗

关于wysihtml5()自定义按钮点击事件

![图片说明](https://img-ask.csdn.net/upload/201512/24/1450947226_467380.png) 当我点击图片中“插入图片”按钮时,弹出windows窗体, 相关代码如下: JS===> $("#compose-textarea").wysihtml5(); HTML====> ``` <div class="form-group"> <textarea id="compose-textarea" name="addNoticeDetalis" class="form-control" style="height: 300px"> </textarea> </div> ```

ajax的异步提交到action,成功插入数据库在页面返回结果

jsp代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>注册</title> <script type="text/javascript"> function checkUserName(obj){ var username = obj; var checkUserNameResult = document.getElementById("checkUserNameResult"); if(username.trim().length==0){ checkUserNameResult.innerHTML = "*用户名不能为空"; obj.focus(); }else{ checkUserNameResult.innerHTML = ""; } } </script> <script type="text/javascript"> function checkPassword(obj){ var password = obj; var checkPasswordResult = document.getElementById("checkPasswordResult"); if(password.trim().length==0){ checkPasswordResult.innerHTML = "*密码不能为空"; obj.focus(); }else{ checkPasswordResult.innerHTML = ""; } } </script> <script type="text/javascript"> function checkrePassword(obj){ var repassword = obj; var checkrePasswordResult = document.getElementById("checkrePasswordResult"); if(repassword.trim().length==0){ checkrePasswordResult.innerHTML = "*确认密码不能为空"; obj.focus(); }else{ checkrePasswordResult.innerHTML = ""; } } </script> </head> <body> <h1>用户注册</h1> <form> <div> 账&nbsp;&nbsp;号:<input type="text" name="username" onblur="checkUserName(this.value);"/> <span id="checkUserNameResult" style="color: red "></span> <br/><br/> 密&nbsp;&nbsp;码:<input type="password" name="password" id="pwd1" onblur="checkPassword(this.value);"/> <span id="checkPasswordResult" style="color: red "></span> <br/><br/> 确认密码:<input type="password" name="repassword" id="pwd2" onblur="checkrePassword(this.value);"/> <span id="checkrePasswordResult" style="color: red "></span> <br/><br/> 性&nbsp;&nbsp;别:<input type="radio" name="sex" value="man" checked="checked" />男 <input type="radio" name="sex" value="woman" />女 <br/><br/> 爱&nbsp;&nbsp;好:<input type="checkbox" name="hobby" value="sport"/>运动 <input type="checkbox" name="hobby" value="sport"/>上网 <input type="checkbox" name="hobby" value="sport"/>看书 <input type="checkbox" name="hobby" value="sport"/>听歌 <input type="checkbox" name="hobby" value="sport"/>睡觉 <br/><br/> 年&nbsp;&nbsp;龄:<input type="text" name="age" /><br/><br/> 出生日期:<input type="text"/><br/><br/> 备&nbsp;&nbsp;注:<textarea name="word" cols=50 rows=10></textarea><br/><br/> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" value="注册" onclick="return checkpasswd()"/>&nbsp;&nbsp; <input type="reset" /> </div> </form> </body> </html> ajax和action如何写啊,才开始学习web,求大神教教

SSH框架项目中文乱码问题,数据插入mysql数据库后,就是??了

**本人刚接触SSH框架项目,一个人自学,会遇到一些个人解决不了的问题,希望寻找志同道合之人一起学习互勉! 如果有师傅带带我必感激不尽! 我对计算机互联网等方面有自己的见解,也十分有热情,喜爱结识志同道合之人,我的QQ:1667134630** 在数据库中手动加两条数据,在浏览器中显示中文是没问题的 ![](https://img-ask.csdn.net/upload/201611/05/1478359436_545746.png) ![图片说明](https://img-ask.csdn.net/upload/201611/05/1478359396_234661.png) 但是点击修改,保存之后就是?了 ![图片说明](https://img-ask.csdn.net/upload/201611/05/1478359659_576831.png) ![图片说明](https://img-ask.csdn.net/upload/201611/05/1478359706_671376.png) 数据库中也变成?了 ![图片说明](https://img-ask.csdn.net/upload/201611/05/1478359759_510580.png) 以下是代码 # list.jsp ``` <%@ page language="java" import="java.util.*" pageEncoding="utf-8" %> <%@ taglib prefix="s" uri="/struts-tags" %> <html> <head> <title>岗位列表</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script language="javascript" src="${pageContext.request.contextPath}/script/jquery.js"></script> <script language="javascript" src="${pageContext.request.contextPath}/script/pageCommon.js" charset="utf-8"></script> <script language="javascript" src="${pageContext.request.contextPath}/script/PageUtils.js" charset="utf-8"></script> <script language="javascript" src="${pageContext.request.contextPath}/script/DataShowManager.js" charset="utf-8"></script> <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/style/blue/pageCommon.css" /> <script type="text/javascript"> </script> </head> <body> <div id="Title_bar"> <div id="Title_bar_Head"> <div id="Title_Head"></div> <div id="Title"><!--页面标题--> <img border="0" width="13" height="13" src="${pageContext.request.contextPath}/style/images/title_arrow.gif"/> 岗位管理 </div> <div id="Title_End"></div> </div> </div> <div id="MainArea"> <table cellspacing="0" cellpadding="0" class="TableStyle"> <!-- 表头--> <thead> <tr align="CENTER" valign="MIDDLE" id="TableTitle"> <td width="200px">岗位名称</td> <td width="300px">岗位说明</td> <td>相关操作</td> </tr> </thead> <!--显示数据列表--> <tbody id="TableData" class="dataContainer" datakey="roleList"> <s:iterator value="list"> <tr class="TableDetail1 template"> <td>${name} </td> <td>${description} </td> <td><s:a onclick="return window.confirm('确定删除当前记录吗?')" action="role_delete?id=%{ id }" namespace="">删除</s:a> <s:a action="role_editUI?id=%{ id }" namespace="">修改</s:a> <s:a href="setPrivilegeUI.html">设置权限</s:a> </td> </tr> </s:iterator> </tbody> </table> <!-- 其他功能超链接 --> <div id="TableTail"> <div id="TableTail_inside"> <a href="saveUI.html"><img src="${pageContext.request.contextPath}/style/images/createNew.png" /></a> </div> </div> </div> </body> </html> ``` # edit.jsp ``` <%@ page language="java" import="java.util.*" pageEncoding="utf-8" %> <%@ taglib prefix="s" uri="/struts-tags" %> <html> <head> <title>岗位设置</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script language="javascript" src="${pageContext.request.contextPath}/script/jquery.js"></script> <script language="javascript" src="${pageContext.request.contextPath}/script/pageCommon.js" charset="utf-8"></script> <script language="javascript" src="${pageContext.request.contextPath}/script/PageUtils.js" charset="utf-8"></script> <script language="javascript" src="${pageContext.request.contextPath}/script/DataShowManager.js" charset="utf-8"></script> <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/style/blue/pageCommon.css" /> <script type="text/javascript"> </script> </head> <body> <!-- 标题显示 --> <div id="Title_bar"> <div id="Title_bar_Head"> <div id="Title_Head"></div> <div id="Title"><!--页面标题--> <img border="0" width="13" height="13" src="${pageContext.request.contextPath}/style/images/title_arrow.gif"/> 岗位设置 </div> <div id="Title_End"></div> </div> </div> <!--显示表单内容--> <div id="MainArea"> <s:form action="role_edit" namespace="/" method="post"> <s:hidden name="id"></s:hidden> <div class="ItemBlock_Title1"><!-- 信息说明<DIV CLASS="ItemBlock_Title1"> <IMG BORDER="0" WIDTH="4" HEIGHT="7" SRC="${pageContext.request.contextPath}/style/blue/images/item_point.gif" /> 岗位信息 </DIV> --> </div> <!-- 表单内容显示 --> <div class="ItemBlockBorder"> <div class="ItemBlock"> <table cellpadding="0" cellspacing="0" class="mainForm"> <tr> <td width="100">岗位名称</td> <td> <s:textfield name="name" cssClass="InputStyle"></s:textfield> * </td> </tr> <tr> <td>岗位说明</td> <td> <s:textarea name="description" cssClass="TextareaStyle"></s:textarea> </td> </tr> </table> </div> </div> <!-- 表单操作 --> <div id="InputDetailBar"> <input type="image" src="${pageContext.request.contextPath}/style/images/save.png"/> <a href="javascript:history.go(-1);"><img src="${pageContext.request.contextPath}/style/images/goBack.png"/></a> </div> </s:form> </div> </body> </html> ``` # web.xml ``` <?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <!-- 通过上下文参数指定spring配置文件的位置 --> <context-param> <param-name>contextConfigLocation</param-name> <param-value>classpath:beans.xml</param-value> </context-param> <!-- 配置spring的上下文载入器监听器 ,项目启动时加载spring --> <listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> </listener> <!-- 配置struts2的前端控制器 --> <filter> <filter-name>struts</filter-name> <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class> </filter> <filter-mapping> <filter-name>struts</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app> ```

td中我想让div和span在一行显示,怎么解决?

我想让div和span在一行显示,怎么解决 代码如下: <table border='1'> <tr> <td>a</td> <td ><div>div</div><span>span</span></td> </tr> <tr> <td>b</td> <td>c</td> </tr> </table> <html> <head> </head> <body> <table border='1'> <tr> <td>a</td> <td ><div>div</div><span>span</span></td> </tr> <tr> <td>b</td> <td>c</td> </tr> </table> </body> </html>

如何将文本区域的内容发送到onclick函数中?

<div class="post-text" itemprop="text"> <p>我正在尝试完成一些Ajax请求,以便在不刷新的情况下将TextArea插入到数据库中。这是我的代码:</p> <p>HTML:</p> <pre><code>&lt;textarea name='Status'&gt; &lt;/textarea&gt; &lt;input type='button' onclick='UpdateStatus()' value='Status Update'&gt; </code></pre> <p>JS:</p> <pre><code>function UpdateStatus(Status) { var Status = $(this).val(); $(function() { $.ajax({ url: 'Ajax/StatusUpdate.php?Status='.Status, data: "", dataType: 'json' }); }); } </code></pre> <p>我的问题:</p> <p>1) 如何将文本区域的内容发送到onclick函数中?</p> <p>2) 如何保留了换行符?</p> </div>

求助ajax执行后,会自动刷新页面,该如何阻止?

asp.net mvc 前台代码: ``` <html> <head> <meta name="viewport" content="width=device-width" /> <title>TestUpload</title> <script type="text/javascript" src="~/Scripts/jquery-1.10.2.min.js"></script> </head> <body> <div> <textarea id="txt"></textarea> <form id="uploadForm" action="Upload/TestAjax" method="post" enctype="multipart/form-data"> <input id="File1" name="fileupload" accept="image/gif, image/jpeg" multiple="multiple" type="file" value="" /> <input id="btn" type="button" value="上传" /> </form> </div> </body> </html> <script type="text/javascript"> $(function () { $("#btn").click(function () { var formData = new FormData($("#uploadForm")[0]); //var formData = $("#uploadForm"); $.ajax({ url: "/Upload/TestAjax", data: formData, type: "POST", cache: false, async: true, contentType: false, processData: false, success: function (data) { console.log(data); }, error: function (data) { console.log(data); }, }); return false; }); }); </script> ``` 后台代码 ``` public ActionResult TestUpload() { return View(); } [HttpPost] public ActionResult TestAjax() { if (Request.Files.Count > 0) { if (Request.Files.Count == 1) { HttpPostedFileBase file = Request.Files[0]; if (file.ContentLength > 0) { string title = string.Empty; title = DateTime.Now.Ticks.ToString() + Path.GetExtension(file.FileName); string path = "/upload/" + DateTime.Now.ToString("yyyyMMdd")+"/" + title; path = System.Web.HttpContext.Current.Server.MapPath(path); file.SaveAs(path); return Json(new { status = true, url = path }); } } else { string[] urllist = new string[Request.Files.Count]; for (int i = 0; i < Request.Files.Count; i++) { HttpPostedFileBase file = Request.Files[i]; if (file.ContentLength > 0) { string title = string.Empty; title = DateTime.Now.Ticks.ToString() +Path.GetExtension(file.FileName); string path = "/upload/" + DateTime.Now.ToString("yyyyMMdd") + "/" + title; path = System.Web.HttpContext.Current.Server.MapPath(path); file.SaveAs(path); urllist[i] = path; } } return Json(new { status = true, url = urllist }); } } else { return Json(new { status = false, url = "", msg = "没有文件" }); } return Json(new { status = false, url = "", msg = "" }); } ``` 其实就是一个简单的ajax文件上传。我的要求是,执行成功不要刷新页面。 但是很奇怪的是,执行不成功时,代码不刷新,一旦执行成功就自动给我刷新了!!!跪求各位大大 开发环境WIN10+VS2015

编辑器(急)

先运行一下下面的代码: editor.html 主要是一些Javascript,用来处理不同的命令。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <SCRIPT LANGUAGE="JavaScript"> <!-- var contentHTML; function exeCommand(command, value) { document.execCommand(command, false, value); } // 加粗 function Black() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('Bold', ''); } // 斜体 function Italic() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('Italic', ''); } // 下划线 function UnderLine() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('Underline', ''); } // 向里缩进 function Indent() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('Indent', ''); } // 向外缩进 function Outdent() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('Outdent', ''); } // 无序列表 function UnorderList() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('InsertUnorderedList', ''); } // 有序列表 function OrderList() { var obj = frames['ifRTC'].RTC; obj.focus(); exeCommand('InsertOrderedList', ''); } // 插入图片 function Image() { var obj = frames['ifRTC'].RTC; obj.focus(); ImagePath = window.prompt('请输入图片路径:', ''); exeCommand('InsertImage', ImagePath); } // 预览效果 function Preview() { var htmlContent = frames['ifRTC'].RTC.innerHTML; var open = window.open(''); open.document.write(htmlContent); } // 查看编辑框里的HTML源代码 function Source() { var htmlContent = frames['ifRTC'].RTC.innerHTML; if (document.all.iframeDiv.style.display == 'block') { document.all.iframeDiv.style.display = 'none'; document.all.htmlText.value = htmlContent; document.all.textDiv.style.display = 'block'; document.all.htmlText.focus(); document.all.Source.value='HTML'; } else { document.all.iframeDiv.style.display = 'block'; document.all.textDiv.style.display = 'none'; frames['ifRTC'].RTC.innerHTML = document.all.htmlText.value; frames['ifRTC'].RTC.focus(); document.all.Source.value=' 源代码 '; } } // 增加编辑框的高度 function Add() { document.all.ifRTC.height = document.all.ifRTC.height*1 + 50; } //--> </SCRIPT> </HEAD> <BODY> <TABLE width="400"border="0"> <TR> <TD><input type="button" value="加粗" name="Black" onclick="Black()" /></TD> <TD><input type="button" value="倾斜" name="Italic" onclick="Italic()" /></TD> <TD><input type="button" value="下划线" name="UnderLine" onclick="UnderLine()" /></TD> <TD><input type="button" value="UL" name="UnorderList" onclick="UnorderList()" /></TD> <TD><input type="button" value="OL" name="OrderList" onclick="OrderList()" /></TD> <TD><input type="button" value="左" name="Outdent" onclick="Outdent()" /></TD> <TD><input type="button" value="右" name="Indent" onclick="Indent()" /></TD> <TD><input type="button" value="图" name="Image" onclick="Image()" /></TD> </TR> </TABLE> <div id="iframeDiv" style="display:block"> <iframe id="ifRTC" width="400" height="200" border="1" src="blank.html" ></iframe> </div> <div id="textDiv" style="display:none"> <textarea id="htmlText" cols="50" rows="10"></textarea> </div> <br> <input type="button" value=" + " name="Add" onclick="Add()" />&nbsp;&nbsp; <input type="button" value=" 预 览 " name="Preview" onclick="Preview()" />&nbsp;&nbsp; <input type="button" value=" 源代码 " name="Source" onclick="Source()" /> </BODY> </HTML> blank.html文件 <html> <body topmargin="10" leftmargin="10" bgColor="#f6f6f6"> <div id="RTC" contenteditable = true></div> </body> </html> 我的问题是,为什么我在编辑框里面,一回车,光标就下跳两行,这是为什么,还有怎么去解决这个问题

JS换行保存后,不显示换行,显示的却是字符<br>

![图片说明](https://img-ask.csdn.net/upload/202001/12/1578817782_338780.png) 缺陷内容保存后可以换行显示,处理结果就不可以,就显示<br> ``` function getAdd() { var w=$(window).width(); var h=$(window).height(); $('#dd').dialog({ title: '添加缺陷记录', width: w * .6, height: h - 136, closed: false, cache: false, href: 'dia/log/defect-record/get-add.html?module_id=' + module_id + '&station_info=' + station_info, modal: true, buttons: [{ text: '保存', iconCls: "easy-icon-save", handler: function () { var shift = $("#reportShift").combobox("getValue"); if(shift == -1 || shift == ""){ $.messager.alert('操作', '请重新核对缺陷上报日期以及所选班次'); return false; } checkStation("station");//检测是否选择或输入 var defectLevel = $('#defectLevel').combobox('getValue'); if (defectLevel == 0 || defectLevel == 1) { var planTime = $('#planProTime').datebox('getValue'); if (planTime == null || planTime == '') { $.messager.alert("修改", "计划处理时间不能为空!", "error"); return; } } var data = $("#defect-add-form").serialize(); // var content = $('#content').val().replace(/\n/g,"<br/>"); $.ajax({ url: "dia/log/defect-record/insert.do?module_id=" + module_id + '&proResult=' + $('#proResult').val().replace(/\r\n/g, '<br/>').replace(/\n/g, '<br/>').replace(/\s/g, ' '), type : "post", dataType : "json", data : data, success : function(request) { if(request.success){ query(); } $.messager.show({ title: '操作提示', msg: request.msg, timeout: 2000, sshowType: 'slide' }); } }); $("#dd").dialog({ closed: true }); } }, { text: '关闭', iconCls: "easy-icon-cancel", handler: function () { $("#dd").dialog({ closed: true }); } }], //用于图形化,窗口打开完成后,给厂站赋值 onLoad: function () { var indexDevId = $("#indexDevId").val(); $('#station').combobox('setValue', indexDevId); } }); } ``` 这是JSP代码 ``` <tr> <td class="td-inputtitle" style="text-align: center">处理结果</td> <td class="td-input" colspan="5" > <c:forEach var="item" items="${historyProcess }"> <c:if test="${item.proResult!=null && item.proResult!='' }"> <div class="history_process"> <div class="user_info">${item.userName }<br/>${item.time }</div> <div class="content" >${fn:replace(item.proResult,vEnter,'<br>') } </div> <div class="clearfix"></div> </div> </c:if> </c:forEach> <textarea type="text" rows="6" name="proResult" id="proResult" style="width:95%;"> ${currProcess.proResult } </textarea> </td> </tr> ```

修改css样式表没有任何效果,将CSS样式表中的内容复制到新的表中导入后,样式同样不在页面显示

在同一个表中,属性相同但是class名不同,调用自己新建的class名不显示效果,但是用原来的就可以 请问是什么原因,后来新建了css表,将原css所有内容原封不动复制进去,再导入,但是效果却不显示, bootstrap的样式可以正常显示,js同样可以正常显示 ![这个是原来的样式](https://img-ask.csdn.net/upload/201701/18/1484705350_8330.jpg) ![我想把中间那块放到中间的,但是没有效果](https://img-ask.csdn.net/upload/201701/18/1484705359_500615.jpg) CSS代码 ``` @charset "utf-8"; *{margin:0px; padding:0px;} body{font-family:"微软雅黑", Arial, Helvetica, sans-serif; font-size:12px; line-height:1.5em; color:#555555;background:#f3f3f3;} ul{list-style-type:none;} input,select,textarea{vertical-align:middle; font-family:inherit; font-size:inherit; color:inherit; outline:none;} h1,h2,h3,h4,h5,h6{font-weight:normal;} a{color:#555555; text-decoration:none; outline:none;} a:hover,a.glink:hover,a.blink:hover{ text-decoration:none;outline:none;} .clear{ clear:both; font-size:0; height:0; line-height:0;overflow:hidden} a img{ border:0;} .leftF{ float:left;} .centerF{float:left;} .rightF{ float:right;} .main{ width:1116px; margin:0 auto; padding-bottom:330px;} .main .mainleft{ width:210px;top:90px; position:relative;} .main .mainright{ float:left;padding:0px;width:905px;} .foot{ background:#999999; color:#ffffff; padding:20px 0; text-align:center; font-size:14px; line-height:24px;} .footinner{ border-top:1px solid #dddddd; color:#ffffff; padding:45px 0 80px 0; text-align:center; font-size:14px; line-height:24px;} .footinner .footintop{ color:#333333;} .footinner .footinbto{ color:#555555;} .bigperson{ margin-bottom:-57px; top:-77px; position:absolute;} .bigperson .touxiang{ width:210px; text-align:center;} .bigperson .touxiang img{ width:100px; height:100px; border:2px solid #fff; border-radius:50%;} .bigperson .personname{ text-align:center; font-size:18px; color:#555555; line-height:32px;} header #header-top {top: 0; right: 0; left: 0; padding: 0 1em; height: 3em; line-height: 3em; color: #fff; background-color: #2c3e50; z-index: 2;} header #header-top #logout { float: right; } header #header-top #logout a { color: inherit; } .current a{display:block; background:#61b988;line-height:38px; height:38px; margin:0px 0 15px 0; color:#fff; font-size:14px;} .current a{color:#FFF;} .funclistul {position:relative;} .funclistul li{ line-height:38px; height:38px;font-size:14px;} .funclistul li a{ text-align:center;display:block; padding:0; line-height:38px; height:38px; font-size:14px; overflow:hidden;} .funclistul li a:hover{ background:#61b988; color:#fff;} .funclistul li b{ width:21px; height:20px; margin:10px 5px 0 0px;} .line {text-align:center;height:0px!important;border-top:solid 1px #CCC;} #divide_line {position:absolute;height:1316px;border-color:#CCC;border-left-style:solid;border-width:1px} #frame_content {border:0px; height:981px; min-height:700px;} .fl{float:left;} .fr{float:right;} .Wrapbody{width:890px;height:900px;overflow:hidden;padding-top:20px;position:relative;margin-left: 50px;} .zla_m_tab { width:850px;height:40px; padding-top:12px; border-bottom:2px #ccc solid;font-size:20px;color:#777;} .zla_m_item { float:left; width:106px; height:40px; } .zla_m_item a ,.zla_m_cur a { display:inline-block; width:150px; height:40px; line-height:40px; text-align:center;font-size:20px;color:#777;} .zla_m_item a:hover , .zla_m_cur a { display:inline-block; background:url(../img/tri.png) center 35px no-repeat; text-decoration:none; border-bottom:2px solid #61b988;font-size:20px;color:#333;} .Div { margin-top:30px; } .ulDiv { margin-top:30px; } .ulDiv ul li { margin-left: 3px; position:relative; width: 270px; margin-bottom: 32px; background-color: #fff; float:left; zoom: 1; letter-spacing: 0; overflow: hidden; height: 150px; margin-right: 16px; border-radius: 3px; } .ulDiv ul li:hover { border-color: rgba(101, 204, 153, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(101, 204, 153, 0.6); } .Mcon1img .Gd { display: block; width: 23px; height: 23px; position: absolute; top: 0px; right: 0px; display: none; } .Mconright{padding:20px;} .Mconright h3{font-size:18px;padding:7px 0 10px 0;} .Mconright h3 a{float:left} .Mconright p{color:#666;font-size:12px;} .Mcon1img{position:relative;} .Mcon1img:hover .Gd{display:block;} .Mconright h3 i{display:none;width:8px;height:8px;background:red;border-radius:8px;margin-left: 5px;float:left;} .red { color: #b9423c; } .green { color: #61b988; } .force_red { color: #b9423c!important; } .force_green { color: #61b988!important; } .block { padding: 30px 0; } .aline { margin-right: 50px; padding: 10px 0; float: right; } .four_in_one { height: 50px; line-height: 50px; width: 172px; padding: 10px 50px 10px 0px; float: right; text-align: center; vertical-align: middle; } .specail_line_one { margin-right: 150px; } .specail_line_two { margin-right: 68px; } .specail_line_three { margin-right: 357px; } .specail_line_four { margin-right: 111px; } .normal_one { font-size: 2em; vertical-align: middle; } .normal_two { font-size: 1.5em; vertical-align: middle; } .normal_three { width: 50px; display: inline-block; font-size: 2em; vertical-align: top; } .normal_one, .normal_two, .normal_three { margin: 5px; height: 30px; line-height: 30px; overflow: hidden; } .one_block { width: 150px; height: 30px; text-align: center; } .one_line { width: 750px; height: 30px; } .many_lines { width: 750px; height: 150px; resize: none; overflow: scroll; } .exam_many_lines { width: 720px; height: 150px; resize: none; overflow: scroll; } .one_block, .one_line, .many_lines, .exam_many_lines { box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); transition: border linear 0.2s, box-shadow linear 0.2s; font-size: 2em; display: inline-block; padding: 4px; color: #555555; vertical-align: middle; background-color: #ffffff; border: 1px solid #e3e3e3; border-radius: 3px; margin: 3px 0; } .one_block:focus, .one_line:focus, .many_lines:focus, .exam_many_lines:focus { border-color: rgba(101, 204, 153, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(101, 204, 153, 0.6); } .submit_button { width: 200px; height: 41px; transition: border linear 0.2s, box-shadow linear 0.2s; font-size: 1.5em; display: inline-block; padding: 4px; color: #555555; vertical-align: middle; background-color: #ffffff; border: 1px solid #e3e3e3; border-radius: 3px; margin: 3px 0; cursor: hand; } .submit_button:hover { border-color: rgba(101, 204, 153, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(101, 204, 153, 0.6); } .submit_button:focus { border-color: rgba(101, 204, 153, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(101, 204, 153, 0.6); } .submit_button:disabled { color: #555555; background-color: #e8e8e8; } .submit_button:disabled:hover { border-color: rgba(232, 232, 232, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.075), 0 0 0 rgba(232, 232, 232, 0.6); } .submit_button:disabled:focus { border-color: rgba(232, 232, 232, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.075), 0 0 0 rgba(232, 232, 232, 0.6); } .check { margin-right: 10px; } .score { padding: 30px 50px; height: 400px; overflow: scroll; } .score_title { font-size: 1.5em; } .button_block { padding: 10px 0; text-align: center; } .marklist { z-index: 50; width:250px; top:105px; right:160px; position:fixed; background: #fff; padding: 10px; border-radius: 3px; } .mark_title, .submit_paper, .marklist ul li { position:relative; margin-bottom: 32px; background: #fff; float:left; zoom: 1; letter-spacing: 0; overflow: hidden; border-radius: 3px; text-align: center; border: 1px solid #61b988; } .mark_title:hover, .submit_paper:hover, .marklist ul li:hover { border-color: rgba(101, 204, 153, 0.8); outline: 0; outline: thin dotted \9; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(101, 204, 153, 0.6); } .mark_title { width: 80px; height: 30px; margin: 10px 120px 10px 8px; } .submit_paper { width: 80px; height: 30px; margin: 20px 8px 10px 150px; } .marklist ul li { width: 30px; height: 30px; margin: 5px 8px; } .mark { line-height: 30px; font-size: 1.5em; color: #61b988; background: #fff; text-align: center; vertical-align: middle; } .active { background: #61b988!important; color: #fff; } .active a { background: #61b988!important; color: #fff; } header #exam_top {z-index:999!important;position: fixed; opacity:0.9; top: 0; right: 0; left: 0; padding: 0 1em; height: 4em; line-height: 4em; color: #3f3f3f; background-color: #fff; z-index: 2;font-size: 1.5em;} .exam_foot {z-index:999!important;margin-top:36px; background:#fefefe; color:#3f3f3f; padding:20px 0; text-align:center; font-size:14px; line-height:24px;} .center { text-align:center; } .exam_head { padding: 0 10px; } .alert_screen {position: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; z-index: 1000;} .alert_block {margin-top: 300px; text-align: center;} .alert_msg {font-size: 2em;} .quit_btn, .alert_btn {margin-top: 50px;text-align: center;} .examright {position:relative; top:105px; padding:25px; width:770px; background: #fff; border-radius: 3px;margin-bottom: 100px;} .title{ font-size: 2em; padding: 10px 0; } .content_box { padding: 20px; } .choice_box { padding-left: 20px; } .content { height: 30px; line-height: 30px; font-size: 1.5em; padding: 10px 0; } .title:target, .content_box:target{ padding-top:72px; } @media screen and (max-width: 1400px){ .marklist { right:100px; } } @media screen and (max-width: 1300px){ .marklist { right:50px; } } @media screen and (max-width: 1200px){ .marklist { right:0px; } } ``` ``` <header> <div id="exam_top"> <div class="leftF"> <span class="exam_head">专业简答题</span> </div> <div class="rightF"> <span class="exam_head">账号:<%=(String) session.getAttribute("login")%></span> </div> <div class="center"> <span class="exam_head">考试限时:30分钟</span> <span class="exam_head">剩余时间:<span class="green" id="time"></span>分钟 </span> </div> </div> </header> <div class="main"> <div class="examright centerF"><!-- class leftF被修改 --> <div class="block" > <form action="SaveAnswer" method="post" id="form1"> <c:forEach items="${sq}" var="QsInfo" varStatus="vs"> <input type="hidden" name="index${vs.count}" value="${QsInfo.essayId}"/><!-- 隐藏题目ID传递给后台 --> <!--循环输出分割线———————————————————————————————————— --> <!-- EL表达式可以自动转型 --> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">专业简答题${vs.count} :</h3> </div> <div class="panel-body">${QsInfo.eTitle}</div> <div class="form-group"> <textarea class="form-control" rows="3" name="ans${vs.count}"></textarea> </div> </div> </c:forEach> </form> <div> <button type="button" class="btn btn-success btn-block" onclick="sub()">提交试卷</button> </div> <!--———————————————————————————————————————————————————————— --> </div> </div> </div> ```

关于ext htmleditor超链接自动转换的实现问题?

<p>因项目需要,要求我做一个ext htmlditor的扩展。但是有两个问题不太清楚,查看代码没有找到相关的片断,请大家指点。</p> <p> </p> <p>第一个:</p> <p> </p> <p>在editor中输入url后,点击鼠标左键,该url字符串会变成超链接。</p> <p> </p> <p>这个功能我看到javaeye的新贴编辑框也有(可视化编辑模式)</p> <p> </p> <p><a href="http://www.google.com/" target="_blank">www.google.com</a><br><br>你们看上面这个超链接。<br>我输入的时候只是输入了“<a href="http://www.google.com/" target="_blank">www.google.com</a>”,但是输入后在链接上左击鼠标后就变成了超链接。<br><br>我看过ext1.1自带的htmleditor源码,虽然该编辑器也有这个功能,但是源码中却没有发现这样不调用命令便生成链接的代码。<br><br>而且我看到在firefox下这个功能是不生效的,谁能告诉我这个是什么原理?是ie自己做的还是作者编码实现的?</p> <p> </p> <p>第二个:</p> <p> </p> <p>根据我的理解,这种html编辑器的实现思路应该是利用一个iframe,和一个textarea,通过两者间的同步来实现。那么,我的用户输入接口应该是哪个?是textarea还是iframe?</p> <p> </p><br/><strong>问题补充</strong><br/><div class="quote_title">atian25 写道</div><div class="quote_div">为啥不用fckeditor&nbsp; </div> <br />项目有求,而且我用的是ext1.1,扩展比较麻烦<br/><strong>问题补充</strong><br/><div class="quote_title">atian25 写道</div><div class="quote_div"><div class="quote_title">deyami 写道</div><div class="quote_div"><div class="quote_title">atian25 写道</div><div class="quote_div">为啥不用fckeditor&nbsp; </div> <br />项目有求,而且我用的是ext1.1,扩展比较麻烦</div> <br /> <br /> <br />god bless you</div> <br /> <br />还没回答我问题呢?<img src="/images/smiles/icon_eek.gif"/> <br /><strong>问题补充:</strong><br />重点提问: <br /> <br />新贴编辑器里那个输入url点击鼠标后自动变为链接是怎么实现的? <br /> <br />就像javaeye这个一样。 <br /> <br />我需要的是这个结论,请给我一个真实的答案。

微信公众号拍照上传多张图片接口

# 现在可以往数据库存储多张照片,但是调用不了拍照接口 ``` <div class="container"> <div class="weui_cells weui_cells_form"> <div class="weui_cell"> <div class="weui_cell_bd weui_cell_primary"> <div class="weui_uploader"> <div class="weui_uploader_hd weui_cell"> <img alt="img" src="/szgmjk/image/icon5.png"> &emsp; <div class="weui_cell_bd weui_cell_primary">现场拍照</div> <div class="weui_cell_ft js_counter">0/6</div> </div> <div class="weui_uploader_bd"> <ul class="weui_uploader_files js_previews"> <!-- 预览图插入到这 --> </ul> <div class="weui_uploader_input_wrp"> <input class="weui_uploader_input js_file" type="file" accept="image/jpg,image/jpeg,image/png,image/gif" multiple=""> </div> </div> </div> </div> </div> </div> </div> <div class="preview"> <div class="weui_mask"></div> <img src="" alt="" /> <a href="javascript:;" class="delete" id="delete">delete</a> </div> //拍照上传接口 // codepen 没办法直接在 body 标签加属性,所以用这里用 js 给 body 添加 ontouchstart 属性来触发 :active document.body.setAttribute('ontouchstart', ''); $(function () { // 允许上传的图片类型 var allowTypes = ['image/jpg', 'image/jpeg', 'image/png', 'image/gif']; //10MB var maxSize = 10 * 1024 * 1024; // 图片最大宽度 var maxWidth = 300; // 最大上传图片数量 var maxCount = 6; var images = []; $('.js_file').on('change', function (event) { var files = event.target.files; // 如果没有选中文件,直接返回 if (files.length === 0) { return; } for (var i = 0, len = files.length; i < len; i++) { var file = files[i]; var reader = new FileReader(); // 如果类型不在允许的类型范围内 if (allowTypes.indexOf(file.type) === -1) { $.weui.alert('该类型不允许上传'); continue; } if (file.size > maxSize) { $.weui.alert('图片太大,不允许上传'); continue; } if ($('.weui_uploader_file').length >= maxCount) { $.weui.alert('最多只能上传' + maxCount + '张图片'); return; } reader.onload = function (e) { var img = new Image(); img.onload = function () { // 不要超出最大宽度 var w = Math.min(maxWidth, img.width); // 高度按比例计算 var h = img.height * (w / img.width); var canvas = document.createElement('canvas'); var ctx = canvas.getContext('2d'); // 设置 canvas 的宽度和高度 canvas.width = w; canvas.height = h; ctx.drawImage(img, 0, 0, w, h); var base64 = canvas.toDataURL('image/png'); var base65 = canvas.toDataURL('image/png'); var base66 = canvas.toDataURL('image/png'); var base67 = canvas.toDataURL('image/png'); var base68 = canvas.toDataURL('image/png'); var base69 = canvas.toDataURL('image/png'); document.getElementById("picture").value = base64; document.getElementById("picture2").value = base65; document.getElementById("picture3").value = base66; document.getElementById("picture4").value = base67; document.getElementById("picture5").value = base68; document.getElementById("picture6").value = base69; // 插入到预览区 var $preview = $('<li class="weui_uploader_file weui_uploader_status" style="background-image:url(' + base64 + ')"><div class="weui_uploader_status_content">0%</div></li>'); $('.weui_uploader_files').append($preview); var num = $('.weui_uploader_file').length; $('.js_counter').text(num + '/' + maxCount); images.push(base64); // 然后假装在上传,可以post base64格式,也可以构造blob对象上传 var progress = 0; function uploading() { $preview.find('.weui_uploader_status_content').text(++progress + '%'); if (progress < 100) { setTimeout(uploading, 30); } else { // 如果是失败,塞一个失败图标 //$preview.find('.weui_uploader_status_content').html('<i class="weui_icon_warn"></i>'); $preview.removeClass('weui_uploader_status').find('.weui_uploader_status_content').remove(); } } setTimeout(uploading, 30); }; img.src = e.target.result; }; reader.readAsDataURL(file); } }); $('.js_previews').on('click', '.weui_uploader_file', function(event){ var index = $(this).index(); var img = images[index]; $('.preview').find('img').attr('src', img); $('.preview').show(); }); }); $(function() { var msg = $("#msg").val(); if (msg != "" && msg.length > 0) { $.alert(msg); } var max = 200; $('#textarea').on( 'input', function() { var text = $(this).val(); var len = text.length; $('#count').text(len); if (len > max) { $(this).closest('.weui_cell').addClass( 'weui_cell_warn'); } else { $(this).closest('.weui_cell').removeClass( 'weui_cell_warn'); } }); }); ``` 求解决,怎么在上传多张图片代码中和拍照接口结合, 如有解决,请留下支付方式,另有重谢。

Ie控制台报错--无法获取未定义或 null 引用的属性“mr_changed”

这段代码比较长,就是js实现动态表格添加数据,通过onblur事件实现只在修改的数据前面加上标记“1”,然后后台通过标记有选择的更新数据。但是有两个问题 1.自带数据修改onblur事件不触发 2.只有点击新增表格,新增修改表格数据,onblur才触发,但是触发后控制台报错 ----无法获取未定义或 null 引用的属性“mr_changed”。 初学者,大家帮帮忙啊 ![图片说明](https://img-ask.csdn.net/upload/201706/07/1496830756_844032.png) ``` <%@ page language="java" pageEncoding="UTF-8"%> <%@ include file="../../base.jsp"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript" src="${ctx}/components/jquery-ui/jquery-1.2.6.js"></script> <script type="text/javascript" src="${ctx}/js/tabledo.js"></script> <script type="text/javascript" src="${ctx}/js/datepicker/WdatePicker.js"></script> <script type="text/javascript"> $().ready(function(){ ${mRecordData} }); /* 实现表格序号列自动调整 created by tony 20081219 */ function sortnoTR(){ sortno('mRecordTable', 2, 1); } function setTRUpdateFlag(obj){ //alert(obj.type); //alert(obj.defaultValue); //var mr_changed = obj.getElementById("mr_changed"); var currTr = obj.parentElement.parentElement; if(currTr.innerHTML.toLowerCase().indexOf("<span")==0){ currTr = obj.parentElement.parentElement.parentElement; } //alert(currTr.innerHTML); if(obj.value!=obj.defaultValue){ //当填写的框内容发生变化时,设置本行记录发生变化标识 currTr.cells[1].all.mr_changed.value = "1"; //document.getElementById("mr_changed").value="1"; } //alert(mr_changed.value); } function addTRRecord(objId, id, productNo, cnumber, grossWeight, netWeight, sizeLength, sizeWidth, sizeHeight, exPrice, tax) { var _tmpSelect = ""; var tableObj = document.getElementById(objId); //得到表格对象 var rowLength = tableObj.rows.length; //行数 oTR = tableObj.insertRow(); //在行尾插入行 oTD = oTR.insertCell(0); //插入一个单元格 oTD.style.whiteSpace="nowrap"; //规定段落不换行 oTD.ondragover = function(){this.className="drag_over" }; //动态加事件, 改变样式类 oTD.ondragleave = function(){this.className="drag_leave" }; oTD.onmousedown = function(){ clearTRstyle("result"); this.parentNode.style.background = '#0099cc';}; //this.style.background="#0099cc url(../images/arroww.gif) 4px 9px no-repeat"; oTD.innerHTML = "&nbsp;&nbsp;"; oTD = oTR.insertCell(1); oTD.innerHTML = "<input class=\"input\" type=\"checkbox\" name=\"del\" value=\""+id+"\"><input type=\"text\" name=\"mr_id\" value=\""+id+"\"><input class=\"input\" type=\"text\" id=\"mr_changed\" value=\"\" name=\"mr_changed\">"; oTD = oTR.insertCell(2); oTD.innerHTML = "<input class=\"input\" type=\"text\" name=\"mr_orderNo\" readonly size=\"3\" value=\"\">"; oTD = oTR.insertCell(3); oTD.innerHTML = "<b><font face='微软雅黑'><font color='blue'>"+productNo;+"</font></font></b> " oTD = oTR.insertCell(4); oTD.innerHTML = "<input type=\"text\" name=\"mr_cnumber\" maxLength=\"10\" value=\""+cnumber+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(5); oTD.innerHTML = "<input type=\"text\" name=\"mr_grossWeight\" maxLength=\"10\" value=\""+grossWeight+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(6); oTD.innerHTML = "<input type=\"text\" name=\"mr_netWeight\" maxLength=\"10\" value=\""+netWeight+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(7); oTD.innerHTML = "<input type=\"text\" name=\"mr_sizeLength\" maxLength=\"10\" value=\""+sizeLength+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(8); oTD.innerHTML = "<input type=\"text\" name=\"mr_sizeWidth\" maxLength=\"10\" value=\""+sizeWidth+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(9); oTD.innerHTML = "<input type=\"text\" name=\"mr_sizeHeight\" maxLength=\"10\" value=\""+sizeHeight+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(10); oTD.innerHTML = "<input type=\"text\" name=\"mr_exPrice\" maxLength=\"10\" value=\""+exPrice+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; oTD = oTR.insertCell(11); oTD.innerHTML = "<input type=\"text\" name=\"mr_tax\" maxLength=\"10\" value=\""+tax+"\" onblur=\"setTRUpdateFlag(this);\" size=\"15\">"; dragtableinit(); //拖动表格行 sortnoTR(); //排序号 //setTRUpdateFlag(); //设置本行记录发生变化标识 } </script> </head> <body> <form method="post"> <input type="hidden" name="id" value="${obj.id}"/> <div id="menubar"> <div id="middleMenubar"> <div id="innerMenubar"> <div id="navMenubar"> <ul> <li id="save"><a href="#" onclick="formSubmit('update.action','_self');">确定</a></li> <li id="back"><a href="list.action">返回</a></li> </ul> </div> </div> </div> </div> <div class="textbox" id="centerTextbox"> <div class="textbox-header"> <div class="textbox-inner-header"> <div class="textbox-title"> 修改出口报运 </div> </div> </div> <div> <div> <table class="commonTable" cellspacing="1"> <tr> <td class="columnTitle_mustbe">客户号:</td> <td class="tableContent"><input type="text" name="customerContract" value="${obj.customerContract}"/></td> <td class="columnTitle_mustbe">制单日期:</td> <td class="tableContent"> <input type="text" name="inputDate" style="width:90px;" value="<fmt:formatDate value="${obj.inputDate}" pattern="yyyy-MM-dd"/>" onclick="WdatePicker({el:this,isShowOthers:true,dateFmt:'yyyy-MM-dd'});" readonly/> </td> </tr> <tr> <td class="columnTitle_mustbe">收货人及地址:</td> <td class="tableContent"><input type="text" name="consignee" value="${obj.consignee}"/></td> <td class="columnTitle_mustbe">L/C No.:</td> <td class="tableContentAuto"> <input type="radio" name="lcno" value="T/T" class="input" <c:if test="${obj.lcno=='T/T'}">checked</c:if>>T/T <input type="radio" name="lcno" value="L/C" class="input" <c:if test="${obj.lcno=='L/C'}">checked</c:if>>L/C </td> </tr> <tr> <td class="columnTitle_mustbe">装运港:</td> <td class="tableContent"><input type="text" name="shipmentPort" value="${obj.shipmentPort}"/></td> <td class="columnTitle_mustbe">运输方式:</td> <td class="tableContentAuto"> <input type="radio" name="transportMode" value="SEA" class="input" <c:if test="${obj.transportMode=='SEA'}">checked</c:if>>海运(SEA) <input type="radio" name="transportMode" value="AIR" class="input" <c:if test="${obj.transportMode=='AIR'}">checked</c:if>>空运(AIR) </td> <tr> <td class="columnTitle_mustbe">价格条件:</td> <td class="tableContent"><input type="text" name="priceCondition" value="${obj.priceCondition}"/></td> </tr> <tr> <td class="columnTitle_mustbe">唛头:</td> <td class="tableContent"><textarea name="marks" style="height:130px;">${obj.marks}</textarea></td> <td class="columnTitle_mustbe">说明:</td> <td class="tableContent"><textarea name="remark" style="height:130px;">${obj.remark}</textarea></td> </tr> </table> </div> </div> <div class="textbox" id="centerTextbox"> <div class="textbox-header"> <div class="textbox-inner-header"> <div class="textbox-title"> 报运下货物的列表信息 </div> </div> </div> <div> <div class="listTablew"> <table class="commonTable_main" cellSpacing="1" id="mRecordTable"> <tr class="rowTitle" align="middle"> <td width="25" title="可以拖动下面行首,实现记录的位置移动."> <img src="../../images/drag.gif"> </td> <td width="20"> <input class="input" type="checkbox" name="ck_del" onclick="checkGroupBox(this);" /> </td> <td width="33">序号</td> <td>货号</td> <td>数量</td> <td>毛重</td> <td>净重</td> <td>长</td> <td>宽</td> <td>高</td> <td>出口单价</td> <td>含税</td> </tr> </table> </div> <div style="padding:10px;"> <input type="button" name="btnAdd" value="新增" onclick="addTRRecord('mRecordTable', '', '', '', '', '', '', '', '', '', '');"/> </div> </div> <div class="textbox-bottom"> <div class="textbox-inner-bottom"> <div class="textbox-go-top"> </div> </div> </div> </div> </form> </body> </html> ```

jsp页面,点击了提交按钮,没反应,跳转不到action

用SSH2在搭一个网站,出现一个jsp页面无法跳转到action。 麻烦大家帮忙看看 [code="java"] <%@ page language="java" import="java.util.*" pageEncoding="gb2312"%> <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>维护单资料</title> <link rel="stylesheet" type="text/css" href="../css/transport.css" /> <script type="text/javascript" src="../js/function.js"></script> </head> <body> <!--标题--> <div id="title"> <div id="font"> <div id="task"> 维护单资料 </div> </div> </div> <!--查询 <div id="query"> <form name="form1"> <div id="numbers">公司编号:<input type="text" name="t1" class="inputs"/></div> <div id="numbers">公司名称:<input type="text" name="t2" class="inputs"/> <input type="button" value="查 询" class="button" /></div> </form> </div>--> <div id="main"> <form name="form1" action="apply!insert.do" method="post"> <!--按钮--> <div id="buttons"> <div id="six"> <div id="niu"> <input type="button" value="返 回" class="button" onClick="javascript:window.location.href='Fmcf2050.jsp'" target="ab"> </div> <div id="niu"> <input type="button" value="提交" class="button"> </div> </div> </div> <!--分页--> <div id="pagination"> </div> <!--下面主体--> <div id="underside" style="height: expression(body . offsetHeight-80);"> <!--空白间隔--> <!--表格--> <div id="mostly"> <table width="200" border="1" id="table" class="tab"> <tr> <td width="30%" class="td_right"> 设备编号: </td> <td width="70%" class="td_left"> <input type="text" name="equipmentID"> </td> </tr> <tr> <td class="td_right"> 报修人员: </td> <td class="td_left"> <input type="text" name="client"> </td> </tr> <tr> <td class="td_right"> 报障时间: </td> <td class="td_left"> <input type="text" name="submitTime"> </td> </tr> <tr> <td class="td_right"> 报障部门: </td> <td class="td_left"> <select name="department"> <option value=""></option> <option value="chuyun"> 储运车间 </option> <option value="tieban"> 铁板车间 </option> <option value="duxin"> 镀锌车间 </option> <option value="tieta"> 铁塔车间 </option> <option value="gangguanta"> 钢管塔车间 </option> <option value="guanta"> 管塔二车间 </option> <option value="bangongshi"> 办公室 </option> <option value="renshi"> 人事部 </option> <option value="caiwu"> 财务部 </option> <option value="caigou"> 采购部 </option> <option value="yingxiao"> 营销部 </option> <option value="houqin"> 后勤部 </option> <option value="anjian"> 安监部 </option> <option value="zhiguan"> 质管部 </option> <option value="qiye"> 信息部 </option> <option value="shengchan"> 生产调度部 </option> <option value="jishu"> 技术设备部 </option> <option value="dangqun"> 党勤工作部 </option> <option value="qiye"> 企业管理部 </option> </select> </td> </tr> <tr> <td class="td_right"> 维护类型: </td> <td class="td_left"> <select name="repairType"> <option value=""></option> <option value="systemFailure"> 系统故障 </option> <option value="newLine"> 增加网线 </option> <option value="networkFailure"> 网络故障 </option> <option value="softwareFailure"> 软件故障 </option> <option value="softwareInstall"> 安装新软件 </option> <option value="printerFailure"> 打印机故障 </option> </select> </td> </tr> <tr> <td class="td_right"> 故障表征: </td> <td class="td_left"> <textarea name="mainContent" cols="1" rows="5" style="width: 200px;"></textarea> </td> </tr> </table> </div> </div> </form> </div> </body> </html> [/code] 对应的ApplyAction 代码是这样: [code="java"] package com.demo.struts2.actions; import java.util.ArrayList; import com.demo.hibernate.dao.ApplyDAO; import com.opensymphony.xwork2.Action; import com.opensymphony.xwork2.ActionSupport; public class ApplyAction extends ActionSupport { private ApplyDAO applyDAO=new ApplyDAO(); // 这个bean属性前千万不能缺少; private int listID; private String client; private String name; private String department; private String deviceType; private String equipmentID; private String deviceModle; private String mainContent; private String repairType; private String submitTime; private String finishTime; private String repairman; private String isSigned; private boolean mark=true; public void isOK(String s){ } @Override public void validate() { // TODO Auto-generated method stub //申请进行维修要验证。 System.out.println("applyAction验证了"); } @Override public String execute() throws Exception { System.out.println("applyAction执行"); // TODO Auto-generated method stub if(this.mark==false){ return Action.INPUT; } return Action.SUCCESS; } public String insert(){ System.out.println("插入新的维修申请单"); ArrayList<String> list=new ArrayList<String> (); list.add(client); list.add(department); list.add(deviceType); list.add(equipmentID); list.add(deviceModle); list.add(mainContent); list.add(repairType); list.add(submitTime); list.add(repairman); list.add(isSigned); //当出现一个填写项为空就不行。 for(String s:list){ if(s.equals("")||s==null){ this.mark=false; break; }else{ System.out.println(s); } } if(!mark){ return Action.ERROR; } return ""; } public ApplyDAO getApplyDAO() { return applyDAO; } public void setApplyDAO(ApplyDAO applyDAO) { this.applyDAO = applyDAO; } public int getListID() { return listID; } public void setListID(int listID) { this.listID = listID; } public String getClient() { return client; } public void setClient(String client) { this.client = client; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getDepartment() { return department; } public void setDepartment(String department) { this.department = department; } public String getDeviceType() { return deviceType; } public void setDeviceType(String deviceType) { this.deviceType = deviceType; } public String getEquipmentID() { return equipmentID; } public void setEquipmentID(String equipmentID) { this.equipmentID = equipmentID; } public String getDeviceModle() { return deviceModle; } public void setDeviceModle(String deviceModle) { this.deviceModle = deviceModle; } public String getMainContent() { return mainContent; } public void setMainContent(String mainContent) { this.mainContent = mainContent; } public String getRepairType() { return repairType; } public void setRepaitType(String repairType) { this.repairType = repairType; } public String getSubmitTime() { return submitTime; } public void setSubmitTime(String submitTime) { this.submitTime = submitTime; } public String getFinishTime() { return finishTime; } public void setFinishTime(String finishTime) { this.finishTime = finishTime; } public String getRepairman() { return repairman; } public void setRepairman(String repairman) { this.repairman = repairman; } public String getIsSigned() { return isSigned; } public void setIsSigned(String isSigned) { this.isSigned = isSigned; } } =[size=large][/size] [/code]

ext的弹出窗口如何布局?

ext渲染html通过div用viewport很好布局,我现在如何在ext的弹出窗口window里布局那,我在ext window里放了queryform和grid grid的布局一直搞不好,设置grid的height就没有列拉条。设置viewConfig : {forceFit : true}则数据显示不正确 [b]问题补充:[/b] 弹出子窗口,要在弹出一窗口如何扑获click事件 [b]问题补充:[/b] 我把代码贴出来: [code="java"] Ext.onReady(function() { Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; var inputPageSize = 8; function renderDescn(value, cellmeta, record, rowIndex, columnIndex, store) { var str = "<input type='button' id='update-btn' value='分组电文详细信息' class='x-btn-wrap x-btn' onclick='Info();'/>"; return str; } var cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), { header : '电文组号', dataIndex : 'DESTINATION', sortable : true }, { header : '电文条数', dataIndex : 'CNT', sortable : true }, { header : '发送时间', dataIndex : 'SENTLOGTIME', sortable : true }, { header : '操作', dataIndex : 'SENTMESSAGEID', renderer : renderDescn }]); /** * 声明数据适配器,将数据源与列模型绑定 */ var MyRecord = Ext.data.Record.create([{ name : 'DESTINATION', mapping : 'DESTINATION' }, { name : 'SENTLOGTIME', mapping : 'SENTLOGTIME' }, { name : 'CNT', mapping : 'CNT' }]) var store = new Ext.data.Store({ proxy : new Ext.data.HttpProxy({ url : '../sentmessagegroup.do?command=list' }), reader : new Ext.data.JsonReader({ totalProperty : 'totalProperty', root : 'root' }, MyRecord) }); /** * 生成Bbar,用于分页显示 */ var bbar = new Ext.PagingToolbar({ pageSize : inputPageSize, store : store, displayInfo : true, displayMsg : '显示第{0}条到{1}条记录,一共{2}条', emptyMsg : '没有记录' }); /** * 声明一个Grid,列表显示信息 */ var grid = new Ext.grid.GridPanel({ el : 'grid', region : 'center', title : '发送分组详细信息', // height : 430, trackMouseOver : false, loadMask : { msg : '正在加载数据,请稍后.....' }, ds : store, cm : cm, sm : new Ext.grid.RowSelectionModel(), bbar : bbar, viewConfig : { forceFit : true } // buttons : [{ // text : '添加电文', // id : 'addbtn', // handler : function() { // addclick(); // } // }] }); window.Info = function() { var PageSize = 8; var selectRecord = grid.getSelectionModel().getSelected(); var data = selectRecord.get("DESTINATION"); //Ext.get("update").on("click", update); function desc(value, cellmeta, record, rowIndex, columnIndex, store) { var str = "<input type='button' id='update' value='详细信息' class='x-btn-wrap x-btn' onclick='update();'/>"; return str; } //Ext.get("update").on("click", update); var infocm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(), { header : '序列号', dataIndex : 'SENTMESSAGEID', sortable : true }, { header : '电文插入时间', dataIndex : 'SENTLOGTIME', sortable : true }, { header : '电文号', dataIndex : 'MESSAGEID', sortable : true }, { header : '电文内容', dataIndex : 'BUFFERDATA', sortable : true }, { header : '终点代码', dataIndex : 'DESTINATION', sortable : true }, { header : '长度', dataIndex : 'LENGTH', sortable : true }, { header : '发送结果', dataIndex : 'SENDRESULT', sortable : true }, { header : '成功时间', dataIndex : 'PROCESSLOGTIME', sortable : true }, { header : '重发次数', dataIndex : 'RESENDNUMBER', sortable : true }, { header : '标注', dataIndex : 'MEMO', sortable : true }, { header : '操作', dataIndex : 'SENTMESSAGEID', renderer : desc }]); var infoRecord = Ext.data.Record.create([{ name : 'SENTMESSAGEID', mapping : 'SENTMESSAGEID' }, { name : 'SENTLOGTIME', mapping : 'SENTLOGTIME' }, { name : 'MESSAGEID', mapping : 'MESSAGEID' }, { name : 'BUFFERDATA', mapping : 'BUFFERDATA' }, { name : 'BUFFERCONTENT', mapping : 'BUFFERCONTENT' }, { name : 'DESTINATION', mapping : 'DESTINATION' }, { name : 'LENGTH', mapping : 'LENGTH' }, { name : 'SENDRESULT', mapping : 'SENDRESULT' }, { name : 'PROCESSLOGTIME', mapping : 'PROCESSLOGTIME' }, { name : 'RESENDNUMBER', mapping : 'RESENDNUMBER' }, { name : 'MEMO', mapping : 'MEMO' }]) var infostore = new Ext.data.Store({ proxy : new Ext.data.HttpProxy({ url : '../sentmessagegroup.do?command=grouplist' }), reader : new Ext.data.JsonReader({ totalProperty : 'totalProperty', root : 'root' }, infoRecord) }); infostore.baseParams = { destination : data }; var infobbar = new Ext.PagingToolbar({ pageSize : PageSize, store : infostore, displayInfo : true, displayMsg : '显示第{0}条到{1}条记录,一共{2}条', emptyMsg : '没有记录' }); var infogrid = new Ext.grid.GridPanel({ region : 'center', title : '发送电文详细信息', height : 210, trackMouseOver : false, loadMask : { msg : '正在加载数据,请稍后.....' }, ds : infostore, cm : infocm, sm : new Ext.grid.RowSelectionModel(), bbar : infobbar // viewConfig : { // forceFit : true // } // buttons : [{ // text : '添加电文', // id : 'addbtn', // handler : function() { // addclick(); // } // }] }); function update() { alert("update start"); var infowin; if (!infowin) { var selectRecord = infogrid.getSelectionModel().getSelected(); var infofrom = new Ext.form.FormPanel({ labelAlign : 'top', buttonAlign : 'right', title : '电文详细信息', bodyStyle : 'padding:5px', height : 415, width : 650, frame : true, url : '../sentmessage.do?command=again', items : [{ layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '序列号', name : 'SENTMESSAGEID', readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '电文插入时间', name : 'SENTLOGTIME', minLength : 1, maxLength : 25, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '电文号', name : 'MESSAGEID', readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '发送方主机代号', name : 'DESTINATION', minLength : 0, maxLength : 17, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '长度', name : 'LENGTH', readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', xtype : 'textfield', fieldLabel : '处理标志', name : 'SENDRESULT', minLength : 0, maxLength : 17, // readOnly : true, // disabled:true, anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '应用处理时间', name : 'PROCESSLOGTIME', minLength : 1, maxLength : 17, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '重发次数', name : 'RESENDNUMBER', minLength : 1, maxLength : 17, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .93, layout : 'form', border : false, items : [{ xtype : 'textarea', fieldLabel : '电文内容', name : 'BUFFERCONTENT', minLength : 1, maxLength : 5000, anchor : '100%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .93, layout : 'form', border : false, items : [{ xtype : 'textarea', fieldLabel : '标注', name : 'MEMO', minLength : 1, maxLength : 500, anchor : '100%' }] }] }], buttons : [{ text : '手动重发', handler : function() { from.getForm().submit({ success : function(form, action) { var json = action.response.responseText; var check = eval("(" + json + ")"); if (check.update == true) { Ext.MessageBox.alert('信息', '更发成功,点击返回列表页面'); grid.render(); } infostore.load({ params : { start : 0, limit : inputPageSize } }); win.close(); }, failure : function(form, action) { var json = action.response.responseText; var check = eval("(" + json + ")"); if (check.check == false) { Ext.MessageBox .alert('错误', '抱歉,该用户权限不够'); } else { Ext.MessageBox.alert('信息', '添加失败,请与管理员联系!'); } } }); } }] } ); infowin = new Ext.Window({ title : 'Window', closable : true, width : 660, height : 435, // border:false, plain : true, draggable : true, collapsible : true, closeAction : 'hide', items : [infofrom] }); } // from.findField("BUFFERDATA").setValue("blob test"); //Ext.get('update-btn').get('update').on("click", update); infowin.show(Ext.get('update')); /** * form加载事件 */ // from.form.findField("BUFFERDATA").setValue(blob.bufferdata); infofrom.getForm().loadRecord(selectRecord); // from.form.findField("BUFFERDATA").setValue(blob.bufferdata); }; var queryform = new Ext.FormPanel({ labelAlign : 'left', region : 'north', title : '电文查询', buttonAlign : 'right', bodyStyle : 'padding:5px', // width : 300, height : 150, frame : true, labelWidth : 80, viewConfig : { forceFit : true }, items : [{ layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ // 用户编号 xtype : 'textfield', fieldLabel : '电文号', name : 'messageid', anchor : '85%' }, { // 用户编号 xtype : 'datefield', fieldLabel : '开始时间', name : 'startdate', format : 'Y-m-d', anchor : '85%' } ] }, { columnWidth : .5, layout : 'form', border : false, items : [{ // 用户名 xtype : 'textfield', fieldLabel : '发送结果', name : 'sendresult', anchor : '85%' }, { // 用户名 xtype : 'datefield', fieldLabel : '结束时间', name : 'enddate', format : 'Y-m-d', anchor : '85%' }] }] }], buttons : [ { text : '查询', handler : function() { var messageid = queryform.form.findField("messageid") .getValue(); // alert("messageid:"+messageid); var sendresult = queryform.form.findField("sendresult") .getValue(); // alert("destination:"+destination); var start = queryform.form.findField("startdate") .getValue(); var startdate; // alert("start:"+start); if (start != null && start != "") { startdate = start.format("Y-m-d"); } // alert("startdate:"+startdate); var end = queryform.form.findField("enddate").getValue(); var enddate; // alert("end:"+end); if (end != null && end != "") { enddate = end.format("Y-m-d"); } // alert("enddate:"+enddate); infostore.baseParams = { messageid : messageid, // destination : data, startdate : startdate, sendresult : sendresult, enddate : enddate }; infostore.reload({ params : { start : 0, limit : inputPageSize } }); } }, { text : '重置', handler : function() { queryform.form.reset(); } }] }) var win = new Ext.Window({ title : 'infoWindow', closable : true, width : 660, height : 500, // border:false, plain : true, draggable : true, collapsible : true, closeAction : 'hide', layout : 'border', items : [queryform, infogrid] }) // infogrid.render(); infostore.load({ params : { start : 0, limit : PageSize } }) // infogrid.render(); win.show(Ext.get('update-btn')); } // =================================表单提交======================================== /** * 为Grid的添加按钮编写单击事件 */ function addclick() { var win; if (!win) { var from = new Ext.form.FormPanel({ labelAlign : 'top', buttonAlign : 'right', title : '添加发送电文信息', bodyStyle : 'padding:5px', height : 275, width : 650, frame : true, autoScroll : true, url : '../sentmessage.do?command=add', items : [{ layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '序列号', name : 'MAPPINGMESSAGEID', anchor : '85%' }, { xtype : 'textfield', fieldLabel : '电文号', name : 'MESSAGEID', anchor : '85%' }, { xtype : 'textfield', fieldLabel : '长度', name : 'LENGTH', anchor : '85%' }, { xtype : 'textfield', fieldLabel : '重发次数', name : 'RESENDNUMBER', minLength : 1, maxLength : 17, anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '电文方向', name : 'DIRECTION', minLength : 1, maxLength : 17, anchor : '85%' }, { xtype : 'textfield', fieldLabel : '主机号', name : 'HOSTDC', minLength : 0, maxLength : 17, anchor : '85%' }, { xtype : 'textfield', fieldLabel : '电文组号', name : 'MESSAGEGROUPID', minLength : 0, maxLength : 17, anchor : '85%' }] }] }], buttons : [{ text : '提交', handler : function() { if (from.form.isValid()) { from.getForm().submit({ success : function() { Ext.MessageBox.alert('信息', '添加成功,点击返回列表页面'); grid.render(); store.load({ params : { start : 0, limit : inputPageSize } }); win.close(); }, failure : function() { Ext.MessageBox.alert('信息', '添加失败,请与管理员联系!'); } }); } } }, { text : '重置', handler : function() { from.getForm().reset(); } }] }); /** * 声明一个window,包装FormPanel */ win = new Ext.Window({ title : 'InfoWindow', closable : true, width : 660, height : 300, // border:false, plain : true, draggable : true, collapsible : true, closeAction : 'hide', items : [from] }); } win.show(Ext.get('addbtn')); }; window.delInfo = function() { var sm = grid.getSelectionModel(); var count = sm.getCount(); if (count == 0) { Ext.MessageBox.alert('信息', '您没有勾选任何记录!'); } else { Ext.MessageBox.confirm('Message', '确定要删除?', function(btn) { if (btn == 'yes') { var record = sm.getSelected(); var str = record.get('MAPPINGMESSAGEID'); Ext.Ajax.request({ url : '../sentmessage.do?command=delete', params : { MAPPINGMESSAGEID : str }, success : function() { Ext.MessageBox.alert('信息', '删除成功'); store.reload(); }, failure : function() { Ext.MessageBox.alert('错误', '请与后台服务人员联系'); }, timeout : 30000, headers : { 'my-header' : 'foo' } }); } }); } }; window.updateInfo = function() { alert("parent upadateinfo"); var win; if (!win) { var selectRecode = grid.getSelectionModel().getSelected(); var from = new Ext.form.FormPanel({ labelAlign : 'top', buttonAlign : 'right', title : '电文详细信息', bodyStyle : 'padding:5px', height : 415, width : 650, frame : true, url : '../sentmessage.do?command=again', items : [{ layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '序列号', name : 'SENTMESSAGEID', readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '电文插入时间', name : 'SENTLOGTIME', minLength : 1, maxLength : 25, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '电文号', name : 'MESSAGEID', readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '发送方主机代号', name : 'DESTINATION', minLength : 0, maxLength : 17, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '长度', name : 'LENGTH', readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', xtype : 'textfield', fieldLabel : '处理标志', name : 'SENDRESULT', minLength : 0, maxLength : 17, // readOnly : true, // disabled:true, anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '应用处理时间', name : 'PROCESSLOGTIME', minLength : 1, maxLength : 17, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }, { columnWidth : .5, layout : 'form', border : false, items : [{ xtype : 'textfield', fieldLabel : '重发次数', name : 'RESENDNUMBER', minLength : 1, maxLength : 17, readOnly : true, style : "background: #B9B9C3;", anchor : '85%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .93, layout : 'form', border : false, items : [{ xtype : 'textarea', fieldLabel : '电文内容', name : 'BUFFERCONTENT', minLength : 1, maxLength : 5000, anchor : '100%' }] }] }, { layout : 'column', border : false, items : [{ columnWidth : .93, layout : 'form', border : false, items : [{ xtype : 'textarea', fieldLabel : '标注', name : 'MEMO', minLength : 1, maxLength : 500, anchor : '100%' }] }] }], buttons : [{ text : '手动重发', handler : function() { from.getForm().submit({ success : function(form, action) { var json = action.response.responseText; var check = eval("(" + json + ")"); if (check.update == true) { Ext.MessageBox.alert('信息', '更发成功,点击返回列表页面'); grid.render(); } store.load({ params : { start : 0, limit : inputPageSize } }); win.close(); }, failure : function(form, action) { var json = action.response.responseText; var check = eval("(" + json + ")"); if (check.check == false) { Ext.MessageBox.alert('错误', '抱歉,该用户权限不够'); } else { Ext.MessageBox.alert('信息', '添加失败,请与管理员联系!'); } } }); } }] } ); win = new Ext.Window({ title : 'Window', closable : true, width : 660, height : 435, // border:false, plain : true, draggable : true, collapsible : true, closeAction : 'hide', items : [from] }); } // from.findField("BUFFERDATA").setValue("blob test"); win.show(Ext.get('update-btn')); /** * form加载事件 */ // from.form.findField("BUFFERDATA").setValue(blob.bufferdata); from.getForm().loadRecord(selectRecode); // from.form.findField("BUFFERDATA").setValue(blob.bufferdata); }; // =================================渲染呈现======================================== /** * 渲染呈现Grid,Store初始化 */ var queryform = new Ext.FormPanel({ labelAlign : 'left', region : 'north', title : '电文查询', buttonAlign : 'right', bodyStyle : 'padding:5px', width : 300, height : 150, frame : true, labelWidth : 80, items : [{ layout : 'column', border : false, items : [{ columnWidth : .5, layout : 'form', border : false, items : [{ // 用户编号 xtype : 'textfield', fieldLabel : '电文号', name : 'messageid', anchor : '85%' }, { // 用户编号 xtype : 'datefield', fieldLabel : '开始时间', name : 'startdate', format : 'Y-m-d', anchor : '85%' } ] }, { columnWidth : .5, layout : 'form', border : false, items : [{ // 用户名 xtype : 'textfield', fieldLabel : '终点代码', name : 'destination', anchor : '85%' }, { // 用户名 xtype : 'datefield', fieldLabel : '结束时间', name : 'enddate', format : 'Y-m-d', anchor : '85%' }] }] }], buttons : [ { text : '查询', handler : function() { var messageid = queryform.form.findField("messageid") .getValue(); // alert("messageid:"+messageid); var destination = queryform.form.findField("destination") .getValue(); // alert("destination:"+destination); var start = queryform.form.findField("startdate").getValue(); var startdate; // alert("start:"+start); if (start != null && start != "") { startdate = start.format("Y-m-d"); } // alert("startdate:"+startdate); var end = queryform.form.findField("enddate").getValue(); var enddate; // alert("end:"+end); if (end != null && end != "") { enddate = end.format("Y-m-d"); } // alert("enddate:"+enddate); store.baseParams = { messageid : messageid, destination : destination, startdate : startdate, enddate : enddate }; store.reload({ params : { start : 0, limit : inputPageSize } }); } }, { text : '重置', handler : function() { queryform.form.reset(); } }] }) var viewport = new Ext.Viewport({ layout : 'border', items : [queryform, grid] }) grid.render(); store.load({ params : { start : 0, limit : inputPageSize } }); }) Ext.override(Ext.menu.DateMenu, { render : function() { Ext.menu.DateMenu.superclass.render.call(this); if (Ext.isGecko) { this.picker.el.dom.childNodes[0].style.width = '178px'; this.picker.el.dom.style.width = '178px'; } } }); [/code] 点击主页面的分组详细信息,跳出一个子窗口,显示该组的详细纪录分页及查询,我现在想要的是在点击子窗口的的详细信息在跳出一个窗口,显示该条纪录的详细信息 [b]问题补充:[/b] to yourgame:我截图贴上来你就明白了,图1是主窗口点击上面的分组电文详细信息,就跳出图2子窗口,我现在就想点击图2的详细信息在跳出一个子窗口图3。图2是渲染到图1的一个div块的id,图2在跳出一个窗口3就没有可渲染的地方,因为图2是一个ext window不包含任何html,我的问题就在这里。 [b]问题补充:[/b] to yourgame:你还是没理解我要啥,你这只实现我做的工作,我的意思主页面跳出一个ext window,点击这个ext window上的grid在跳出一个ext window [b]问题补充:[/b] to yourname:子窗口可以跳出,但是值代不出来,第3个窗口的列信息和主窗口是不一样的

2019 Python开发者日-培训

2019 Python开发者日-培训

150讲轻松搞定Python网络爬虫

150讲轻松搞定Python网络爬虫

设计模式(JAVA语言实现)--20种设计模式附带源码

设计模式(JAVA语言实现)--20种设计模式附带源码

YOLOv3目标检测实战:训练自己的数据集

YOLOv3目标检测实战:训练自己的数据集

java后台+微信小程序 实现完整的点餐系统

java后台+微信小程序 实现完整的点餐系统

三个项目玩转深度学习(附1G源码)

三个项目玩转深度学习(附1G源码)

初级玩转Linux+Ubuntu(嵌入式开发基础课程)

初级玩转Linux+Ubuntu(嵌入式开发基础课程)

2019 AI开发者大会

2019 AI开发者大会

玩转Linux:常用命令实例指南

玩转Linux:常用命令实例指南

一学即懂的计算机视觉(第一季)

一学即懂的计算机视觉(第一季)

4小时玩转微信小程序——基础入门与微信支付实战

4小时玩转微信小程序——基础入门与微信支付实战

Git 实用技巧

Git 实用技巧

Python数据清洗实战入门

Python数据清洗实战入门

使用TensorFlow+keras快速构建图像分类模型

使用TensorFlow+keras快速构建图像分类模型

实用主义学Python(小白也容易上手的Python实用案例)

实用主义学Python(小白也容易上手的Python实用案例)

程序员的算法通关课:知己知彼(第一季)

程序员的算法通关课:知己知彼(第一季)

MySQL数据库从入门到实战应用

MySQL数据库从入门到实战应用

机器学习初学者必会的案例精讲

机器学习初学者必会的案例精讲

手把手实现Java图书管理系统(附源码)

手把手实现Java图书管理系统(附源码)

极简JAVA学习营第四期(报名以后加助教微信:eduxy-1)

极简JAVA学习营第四期(报名以后加助教微信:eduxy-1)

.net core快速开发框架

.net core快速开发框架

玩转Python-Python3基础入门

玩转Python-Python3基础入门

Python数据挖掘简易入门

Python数据挖掘简易入门

微信公众平台开发入门

微信公众平台开发入门

程序员的兼职技能课

程序员的兼职技能课

Windows版YOLOv4目标检测实战:训练自己的数据集

Windows版YOLOv4目标检测实战:训练自己的数据集

HoloLens2开发入门教程

HoloLens2开发入门教程

微信小程序开发实战

微信小程序开发实战

Java8零基础入门视频教程

Java8零基础入门视频教程

相关热词 c# cad插入影像 c#设计思想 c#正则表达式 转换 c#form复制 c#写web c# 柱形图 c# wcf 服务库 c#应用程序管理器 c#数组如何赋值给数组 c#序列化应用目的博客园
立即提问