根据所选值下拉 cf7 在段落中显示条件文本

Question

基于this 线程我有一个下拉菜单，它在表单的下一个问题的句子中显示所选值。 Now I would also like, when one of the values is chosen, another question of the form shows some other text in the sentence, like this:

年份是下拉值，金额是问题（段落）中应显示的条件文本。

2020：30.846，- 2019：30.360，- 2018：30.000，- 2017：25.000，- 2016 年：24.437，-

我已经学会了如何使用值来管理它，而不是根据所选值使用不同的文本。

代码我现在要得到的年数：

<p>Did you unsubscribed yourself in <span id="recent-years"></span>?</p>
[radio radio-uitgeschreven-nl class:inline-control "Yes" "No"]

并获得岁月：

<script>
jQuery(document).ready(function( $ ){
$('select[name="recent-years"]').on('change', function(){
   updateParagraph(); 
});
updateParagraph();

function updateParagraph(){
// Assign variable $placeholder to the chosen value
   let $placeholder = $('select[name="recent-years"]').val();
   // replace 'your-field-name' with the cf7 field name
   $('input[name="ba-maanden"]').attr('placeholder', $placeholder);
   //New code to also add to the form html
   $('#recent-years').html($placeholder);
 }
});
</script>

输入字段 ba-maanden 用于其他内容。所以这就是为什么你也会在这里看到这个。

所以我希望当有人选择特定年份时，他们会在这个问题中看到上面提到的另一个金额：

<p>Do you have endowment insurance or savings account of more than 30.846 EUR?</p>
[radio radio-kapitaal-spaar class:inline-control "Ja" "Nee"]

我想我可以将金额放在<span>year-amount</span> 之间。但是如何根据所选年份提取金额？

任何帮助将不胜感激！

最好的问候，

瓦斯科

Answer 1

像这样？

jQuery(document).ready(function($){
  $('select[name="recent-years"]').on('change', function(){
     changeQuestion($(this)); 
  });
  $('input[name="confirm-insurance"]').on('change', function(){
     changeQuestion($(this)); 
  });
});

function changeQuestion(object, selector){
  let currentParagraph = $(object).closest('.question');
  let currentValue = $(object).val();
  let nextParagraph = $(object).closest('.question').next('.question');
  
  $(currentParagraph).fadeOut("slow", function() {
    $(nextParagraph).show().removeClass('hide');
    $(nextParagraph).find('.lastAnswer').text(currentValue);
  });
}

.hide {
  display:none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p class="question">
  Did you unsubscribed yourself in 
  <span id="recent-years">
   <select name="recent-years">
     <option selected="true" disabled="disabled">Select year</option>
     <option value="30.846">2020</option>
     <option value="30.360">2019</option>
   </select>
  </span> ?
</p>

<p class="question hide">
  Do you have endowment insurance or savings account of more than <span class="lastAnswer"></span> ?<br>Yes <input type="radio" name="confirm-insurance" value="yes"> No <input type="radio" name="confirm-insurance" value="no">
</p>

<p class="question hide">
  Your answer is <span class="lastAnswer"></span>.
</p>