Question

我有一个javascript函数，当单击一个按钮时，它会在光标位置插入（或包装）各种文本。插入文本的选项（如果需要）是通过提示/警报。

我正在为表单的上传部分添加模式窗口以供选项使用，因此我可以删除提示/提醒。

在模态窗口之前，javascript函数知道在单击上载“浏览”按钮时插入文本的位置。

在模态窗口之后，js insert函数将起始位置解释为“0”，并将文本插入到开头而不是光标所在的位置。

问题：如何将光标位置传递给插入函数的模态窗口？

注意：
1.我找到Pass javascript to php in modal window和其他几个，但它们似乎不适用这是手写的（没有javascript框架） 3.代码示例很快就可以实现，而非生产。

表单示例（模态之前）：

<form method="post" enctype="multipart/form-data" />
 <input type="file" id="upfile" name="upfile" onchange="ins('up')" />
 <input type="button" value="Line Break" onclick="ins('<br />')" />
 <input type="button" value="Heading" onclick="ins('<h4>','</h4>')" />
 <textarea id="body" name="text">Some string</textarea>
</form>

的Javascript ：

function ins(st,en){
 e=document.getElementById('body');
 sel=e.value.substring(e.selectionStart,e.selectionEnd);
 en=(en?en:'');
 switch(st){
  case'up':
  f=document.getElementById('upfile').files[0].name;
  src='<?php echo $dir; ?>/'+f;
  if(f.match(/\.(png|jpg|jpeg|svg|gif|tif|tiff)$/)){
   intro=confirm('OK = Regular Image\n\nCancel = Intro Image');
   if(!intro)en='</a>';
   img=confirm('OK = Style: Image\n\nCancel = Style: Thumbnail\n\n');
   alt=prompt('Alt:\n');
   if(!alt)return;
   st='<img src="'+src+'" class="'+(img?'image':'thumb')+'" alt="'+alt+'" /\>';
  } else {
   ftxt=prompt('Text:\n');
   if(!ftxt)return;
   st='<a href="'+src+'">'+ftxt+'</a>';
  }
  break;
  [...]
 }
 e.value=e.value.substring(0,e.selectionStart)+st+sel+en+e.value.substring(e.selectionEnd,e.value.length);
 e.focus();
}

表单示例（模态之后）：

<style>
 #up {position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,.3);}
 #up div {width:400px; margin:50px auto 0px; padding:20px; background:#fff;}
</style>

<form method="post" enctype="multipart/form-data" />
 <input type="file" id="upfile" name="upfile" onchange="this.form.submit()" />
 <input type="button" value="Line Break" onclick="ins('<br />')" />
 <input type="button" value="Heading" onclick="ins('<h4>','</h4>')" />
 <textarea id="body" name="text">Some string</textarea>
</form>

if (isset($_FILES['upfile']['tmp_name'])) {
 echo '<form id="up" method="post"><div>';
 if (getimagesize($_FILES['upfile']['tmp_name'])) {
  echo '<input type="checkbox" name="intro" /> Intro Image<br />
  Style:<br />
  <input type="radio" name="style" value="thumb" checked /> Thumbnail<br />
  <input type="radio" name="style" value="image" /> Image<br /><br />
  Alt:<br />
  <input type="text" name="alt" />';
 }
 <input type="submit" value="Upload" /> <input type="submit" value="Cancel" />
 </div></form>';
 if (isset($_POST['Upload'])) {
  if (isset($_POST['style'])) {
   $intro = isset($_POST['intro']) ? '</a>' : '';
   $link = '<img src="'.$dir.'somefilename" class="'.$_POST['style'].'" alt="'.$_POST['alt'].'" />'.$intro;
   echo '<script>ins(\''.$link.'\')</script>';
  }
  // Upload routine.
 }

所以，因为js被解析为客户端;如何将光标位置传递给插入函数的模态窗口？

提前致谢！

如果不可能，是否有另一种方式（没有js框架或ajax）？

（Javascript）将光标位置传递给模态窗口

0 个答案: