javascript - 如何清除文本区域？

Question

我在清除应用程序中的文本区域时遇到问题。该应用程序有两种获取特定数据格式的方法:搜索在线数据库和使用 javascript 库。

第一种方法:用户在文本字段中键入化学名称，然后按“搜索”按钮。如果请求的化合物在数据库中，则会在文本区域中显示正确的格式。

第二种方法:如果在数据库中找不到名称，则用户可以使用 JS 库生成适当的格式，并在同一文本区域中显示。

如果用户首先使用数据库，文本区域包含从数据库生成的数据，如果用户决定使用它，可以用 JS 库生成的数据替换它。问题是，如果文本区域已经有 JS 库生成的数据，则在使用第一种方法时，无法将其替换为数据库中的数据。在从数据库中插入数据之前，我不知道如何清除包含数据(由 JS 库生成)的文本区域。对不起，如果它仍然听起来令人困惑。

这是一段javascript代码:

<script>
  var sketcher = new ChemDoodle.SketcherCanvas('sketcher', 400, 300, {useServices:true});
  var mol = sketcher.getMolecule();
  var molFile = ChemDoodle.writeMOL(mol);

  function myFunc($data)
 {
  document.getElementById('txt_area').value = $data
  return false
  }
</script>

<span onclick="myFunc(ChemDoodle.writeMOL(sketcher.getMolecule()));"
 <button href='javascript:void(0)'; type="submit" id="get_mol">Get Mol</button>
</span>

Jquery/ajax:

$('#search').on('click', function() 
  {    
    chemical = $('#chemical').val();        
    $.ajax({
    type: "GET",
    url: "/_get_smiles",
    data : { 'chemical': chemical},
    success: function(data)
    {        
    $('#txt_area').text(data.smiles);
    },
    error: function(error) 
    {
    console.log(error)
    }
   });  
  });

HTML:

<input type="text" id="chemical" size="40">
<button type="submit" id="search" value="Search">Search</button>
<textarea id="txt_area" name="smiles_mol" rows="28" cols="49"></textarea>

要清除文本区域，我使用以下方法但不成功:

$('#txt_area').text = "";
$('#txt_area').html = "";
$("#txt_area").attr("value", "");

方法 $('#txt_area').val("");清除文本区域但阻止从数据库插入数据。非常感谢任何意见和建议!

Answer 1

我认为您只需更改 jQuery/AJAX 部分即可使用:

$('#txt_area').val(data.smiles);

但是，由于您似乎拥有两段不同的 JavaScript 和两段 HTML，但并未将它们编写在一起，因此这些部分之间的关​​系有点令人困惑。文件的结构是这样的吗？如果一个应该是另一个的后备，感觉它应该自动完成。

编辑 - 像这样，如果我理解正确的话:

$('#search').on('click', function() {    
  chemical = $('#chemical').val();        
  $.ajax({
    type: "GET",
    url: "/_get_smiles",
    data: {
      'chemical': chemical
    },
    success: function(data) {
      if (data.smiles) {
        $('#txt_area').val(data.smiles);
      } else {
        $('#txt_area').val(ChemDoodle.writeMOL(sketcher.getMolecule()));
      }
    },
    error: function(error) {
      console.log(error);
      $('#txt_area').val(ChemDoodle.writeMOL(sketcher.getMolecule()));
    }
  });  
});