4

私は実用的な解決策を見つけようとしていますが、現時点では何も役に立ちません。私は次のフォームを持っています:

<form id="searchform" action="/search" onsubmit="putText()">
<div class="section" >
<div class="edit"><div ContentEditable = "true" id="text"></div></div>
<div class="control" onclick="sbmt()"></div>
</div>
<input id="s" name="q" class="submit" type="submit" value="Send">
</form> 

次のjsで:

$(window).load(function(){
$(document).ready(function() {
 $('.edit').keydown(function(e) {
     if(e.which == 13) {
         //debugger;
        $(this).blur().next().focus();
        return false;
      }
 });
 })
});


function ElementInit() {
  new SectionalElement({
    sectionalNodeClassName: 'section',
    controlNodeClassName: 'control',
    background: '#f4fa58'
  }, 'sectional_element');
  return true;
}

function putText() {
  document.getElementById('s').value = document.getElementById('text').textContent;  
  return true;
}

function sbmt() {
document.getElementById("searchform").submit();
}

(また、jquery-1.8.3.jsを使用します)クエリは「mysite.com/search?q="」のようになります。必要なのは、単純な入力ではなく、送信ボタンとしてdiv class = "control"を使用することだけです(入力ボタンをdivに置き換えるだけです)。入力ボタンを押すとすべて問題ありませんが、DIV class = "control"を使用すると、送信が機能しません。フォームは送信されますが、クエリのテキストは表示されません。送信divはサードパーティのAPIの一部であるため、入力だけを使用することはできません。

提案をありがとう。

4

3 に答える 3

5

#text div内のデータを取得する場合は、jQueryを使用してdivからデータを取得できます。

function sbmt() {
  var param = '';

  // jQuery
  param = $('#text').text();

  // or you could use pure javascript
  param = document.getElementById('text').innerHTML;

  // Now that you have these values you should add them to your form as an input
  // input fields are how you send data through forms to wherever you are posting them
  // build the input field
  param = "<input type='text' name'param1' value='" + param + "'/>";

  // append it to the form
  $('#searchform').append(param);

  // finally submit the form.
  document.getElementById("searchform").submit();
}

name次に、入力フィールド(この場合はparam1)で割り当てたパラメーターに基づいて、送信されたパラメーターにアクセスできるようになります。

何が起こっているのかを調べたい場合は、このjsfiddleを試してみてください。

于 2013-03-17T20:09:42.750 に答える
0

非フォーム要素でフォームアクションを使用しようとしています。代わりに入力要素を使用してください。

于 2013-02-20T20:59:35.287 に答える
0

contenteditable.coffee

$('[contenteditable_form]').on 'submit', (e) -> 
  $form = $ e.target
  $form.find("[data-hidden-input]").each (i, e) ->
    $contenteditable = $ e
    attr = $contenteditable.data('hiddenInput')

    hidden_input = $form.find "[#{attr}]"

    value = $contenteditable.html()

    $(hidden_input).val value

example.html

<input class="hidden" hidden_description name="some_name" type="hidden"> 
<div contenteditable="true" data-hidden-input="hidden_description"></div>

ソース:https ://gist.github.com/dapi/eb737f5a7a7461cb548e

于 2014-09-02T16:25:41.657 に答える