在按钮提交时将 <p> 数据发送到弹出窗口

Posted 2023-05-09

【中文标题】在按钮提交时将 <p> 数据发送到弹出窗口

【英文标题】：Sending <p> data to a popup on button submit

【发布时间】：2018-11-02 04:29:57

【问题描述】：

我有 3 个单选按钮。在它们中的每一个中都有一个带有一小行文本的<p> 标签。我想要实现的是从所选单选按钮中获取文本，并在用户单击提交按钮时将其放入弹出框中。

这是设置：

<label class="container">
  <p>some text here....</p>
  <input type="radio" name="yourmenu">
  <span class="checkmark"></span>
</label>

【问题讨论】：

你能定义你所说的“弹出”是什么意思吗？大概是alert()？还请添加您自己编写的 JS 代码以尝试解决此问题。我们总是很乐意在 SO 帮助调试代码，但我们不是来为您编写代码的。

嘿，罗里，是的，我的意思是alert()

在 onclick 中获取单选按钮的文本，如下所示.. var radiotext = $(this).parent("label").child("p").text();alert(radiotext) ;

【参考方案1】：

你是说

$("form").on("submit",function(e) 
  var text = $("[name=yourmenu]:checked").prev().text();
  if (!confirm(text)) e.preventDefault(); // cancel submit if not confirming
);

更详细的版本：

$("form").on("submit", function(e) 
  var text = $("[name=yourmenu]:checked").prev().text() || "Intet valg";
  if (text=="Intet valg")  // nothing selected
    e.preventDefault();
    alert(text);
    return;
  
  if (!confirm(text)) e.preventDefault(); // cancel submit if not confirming
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <label class="container">
    <p>Vil du have Pizza?</p>
    <input type="radio" name="yourmenu">
    <span class="checkmark"></span>
  </label>
  <label class="container">
    <p>Vil du have Pasta?</p>
    <input type="radio" name="yourmenu">
    <span class="checkmark"></span>
  </label><br/>
  <input type="submit" />
</form>

【讨论】：

谢谢！是的，这正是我想要的！ :)

不客气-请查看How does accepting an answer work

【参考方案2】：

如果我理解正确，那么

$("form").on("submit",function(e) 
  var textSelected=$('input:radio[name=yourmenu]:checked').prev('p').text();
  alert(textSelected);
);

【讨论】：

你测试过这个吗？

@mplungjan 是的，感谢您的提示，我错过了获取检查单选值的条款。 :)