Question

我正在为我的孩子制作一个小的madlib游戏，但由于select和input元素，我在div中获取文本时遇到了一些麻烦。

例如：

<div class='para1'>
This is a madlib game. 
Do you <select id='no1'>
<option selected>like</option>
<option> not like </option>
</select>
this kind of game? What would you rate it as, <input type="text">.
</div>

使用$（'。para1'）。text（）获取选择框中的所有垃圾;使用$（'para1'）。html（）获取标记垃圾。

我希望所选选项的文本和任何用户输入 - 以及div中的新静态文本 - 可以这样做吗？

最终输出应为：这是一个madlib游戏。你喜欢这种游戏吗？您将它评为什么，[此处输入值]。

请参阅此处的示例：http://jsfiddle.net/4Fysw/

Answer 1

这是一个小提琴：http://jsfiddle.net/4Fysw/7/

在jquery网站上找到关于.text（）的内容，它不适用于输入或脚本标签，所以为了得到你想要的东西我相信唯一的方法是确保文本的格式支持抓住它的一种简单方法，正如我在小提琴中所做的那样。

我基本上将所有字符串包装在<span>标记中，因为它们不会导致浏览器或css强制样式（当然除非你有span的默认样式），并且它们允许你对子项进行迭代父para1元素并确定是否应使用.val（）函数或仅使用普通的.text（）函数来获取数据以构建字符串。

希望这有帮助。

<强>更新根据评论 - 这是一个稍微重构的小提琴，支持更多的灵活性：http://jsfiddle.net/8QaFn/3/

Answer 2

在选项标记内添加value属性。

<option value="like">like</option>

将其打印为：

$('#no1').val();

文本框也应该有自己的ID：

<input type="text" id="text1">

我更新了你的小提琴： http://jsfiddle.net/4Fysw/2/

Answer 3

这可以帮到你。

$('#print').click(function(){
    var text1 = $('#no1').find(":selected").text();
    var text2 = $('.para1 input').val();
    $('#output').val(text1);
    $('#output2').val(text2);});

工作演示：http://jsfiddle.net/4Fysw/3/

如果它还包括通过选择和输入框的一些用户输入，我如何才能获取div中的文本？

3 个答案: