如何在文本字段輸入上執行javascript函數並用新值更新字段

Question

我使用JavaScript函數在iframe標記中找到src字符串並返回找到的src字符串，並且它可以單獨正常運行，但是我需要在文本輸入字段上使用它來在輸入粘貼中獲取iframe src，並更新與該函數返回的新值相同的字段。

搜索功能正常工作

function findSrc(str, pointa, pointb) 
{
  var str = " "+str;
  var pa = str.indexOf(pointa);

  if( pa == 0 ) return "";
  pa += pointa.length;
  var pb = str.indexOf(pointb,pa) - pa;

  return str.substr(pa,pb);
}

用於文本字段的方法，但在控制台中失敗並沒有錯誤消息

var fld = document.getElementById('textfield');
var src = fld.value;
fld.oninput = function() {
  if( src.indexOf('<iframe') != -1 ) {
    fld.value = findSrc(src, 'src="', '"');
  }
}

的HTML

<input type="text" id="textfield" name="embedsrc" size="50" value="" />

什么是實現我的目標的正確方法？

Answer 1

我使用以下方法進行操作，但是，如果有更好或有效的方法，請告知。

相同的字符串搜索功能

function findSrc(str, pointa, pointb) 
{
  var str = " "+str;
  var pa = str.indexOf(pointa);

  if( pa == 0 ) return "";
  pa += pointa.length;
  var pb = str.indexOf(pointb,pa) - pa;

  return str.substr(pa,pb);
}

創建了一個新功能

function getsrc() 
{
  var fld = document.getElementById('textfield');
  var src = fld.value;
  if( src.indexOf("<iframe") != -1 ) {
    fld.value = findSrc(src, 'src="', '"');
  }
}

HTML將addEventListener附加到該字段，並回調新函數

<input id="textfield" name="frmsrc" type="text" size="50" value="" />
<script>
document.getElementById("textfield").addEventListener("input", getsrc);
</script>